I have:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="/temp/css/menu.css" />
<link rel="stylesheet" type="text/css" href="/temp/css/bottomchatdiv.css" />
<link rel="stylesheet" type="text/css" href="/temp/css/centercontent.css" />
<link rel="stylesheet" type="text/css" href="/temp/css/basics.css" />
<script type="text/javascript" src="jquery-1.7.js"></script>
<script type="text/javascript" src="jquery.ba-bbq.js"></script>
<script type="text/javascript" src="jquery.ba-bbq-addtl.js"> </script>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript">
function getusto(anchorid) {
$(anchorid).scrollTo();
}
</script>
<script type="text/javascript" src="hide&show.js">
</script>
</head>
<body >
<div class="bbq">
<div class="bbq-nav bbq-nav-top menu">
<a class="mainitem menu_links" href="">Welcome</a> <br>
<a class="menu_links" href="#" onclick="getusto('welcome'); return false;">Welcome</a><br>
<a class="menu_links" href="#" onclick="getusto('guidelines'); return false; ">Guidelines</a>
<br>
<hr style="width:48%"/>
<br>
<a class="mainitem menu_links" href="#Regular-Visitors-&-Ops.html">Regulars & Ops</a> <br>
</div>
<br>
<div class="bbq-content centercontent">
<!-- This will be shown while loading AJAX content. You'll want to get an image that suits your design at http://ajaxload.info/ -->
<div class="bbq-loading" style="display:none;">
<img src="/shell/images/ajaxload-15-white.gif" alt="Loading"/> Loading content...
</div>
<!-- This content will be shown if no path is specified in the URL fragment. -->
<div class="bbq-default bbq-item">
default welcome text here.
</div>
</div>
</div>
</body>
</html>
Now, the problem is Regular-Visitors-&-Ops.html page wouldn't load, but it was loading! So I tinkered with my undos until I found that not including prototype.js let that link work via jquery bbq's way.
What gives? How do I get both prototype.js & jquery bbq coexisting? I need both for different things..
to get this up & running you need an additional Regular-Visitors-&-Ops.html file in the same directory, say:
<!DOCTYPE html>
<head>
</head>
</body>
this is the additional file.
</body>
</html>
As well as jquery, jquery bbq's two scripts (I named one myself), & prototype.js.
now if you do set this up - takeaway prototype & the Regular-Visitors(...) link works. problem is, i am using prototype.js. so either how do i get these two to work, or more easily, how i do implement a scrollTo function (can't use anchors, due to jquery bbq hogging the anchors/hashes (e.g. "#welcome" in "index.html#welcome") WITHOUT USING PROTOTYPE.JS? there should be one right?
By including prototype.js after jQuery, Prototype will override the value of the global
$
variable. You just need to use:You can then use
$j
in place of$
in jQuery contexts and$
for prototype contexts. Here's the documentation: http://api.jquery.com/jQuery.noConflict/.jQuery and Prototype both use the $ character so they will conflict.
If you wish to use them both together you will need to make use of jQuery's noConflict() method to release the $ alias back to Protoype
There is also a scrollTo jQuery plugin