How to add 3 sets of JavaScript in the header
I'm trying to run three sets of JS code in my header tag, however, I can only seem to run two at a time with the following code (see below)...
(this code below works perfectly fine on it's own)
<link rel="stylesheet" href="http://www.frhdesigns.com/lightbox2.04/css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/prototype.js"></script>
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.localscroll-min.js" type="text/javascript"></script>
<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.scrollTo-min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/lightbox.js">
</script>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery.localScroll.defaults.axis = 'y';
jQuery.localScroll();
});
</script>
...Now when I add the third set of code to the mix (3rd set of js code below) which is a code for fading images, I can't seem to get all three to work together when I view the page. I know JS is all about order...but I don't know the order...
<script type="text/javascript" src="_fade_in/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="_fade_in/js/custom.js"></script>
thanks!
ok. where should I place this line of code
<script type="text/javascript" src="_fade_in/js/custom.js"></script>
**in the following sequence?**
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/prototype.js"></script>
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/scriptaculous.js?load=ef开发者_StackOverflow社区fects,builder"></script>
<script type="text/javascript" src="_fade_in/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.localscroll-min.js" type="text/javascript"></script>
<script src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.scrollTo-min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.frhdesigns.com/lightbox2.04/js/lightbox.js"></script>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery.localScroll.defaults.axis = 'y';
jQuery.localScroll();
});
</script>
Judging by the names of your files, it looks like you are loading jQuery twice.
<script type="text/javascript" src="http://www.frhdesigns.com/jquery-vertical-scroll/js/jquery.min.js"></script>
<script type="text/javascript" src="_fade_in/js/jquery-1.3.2.min.js"></script>
Get rid of the second jQuery include and update the first to the particular version you need (if it isn't already).
You need to enable jQuery.noConflict(); for jQuery.
<script type="text/javascript">
jQuery.noConflict();
// Use jQuery instead of $
jQuery(document).ready(function(){
jQuery("div").hide();
});
// prototype codes
// scriptaculous
</script>
精彩评论