jquery - Javascript Conflict with 2 scripts - Need Help! -
if jscript issue i'd grateful! have 2 scripts different sections of page i'm placing in head, in conflict on same page , can't seem them work together. both follows:
<script type="text/javascript"> jquery.noconflict(); function updatesubcat() { $category = $('topcat').options[$('topcat').selectedindex].value; if ($category.match(' redir')) { jquery('#subcategory').html(''); window.location.href='/<%=server.htmlencode(session("publicfranchisename"))%>/' + $category.replace(' redir','') + '.html'; } { pagetodiv("/ajax/home_subcategory.asp?c="+$category,"subcategory"); } } </script> **and:** <script type="text/javascript"> $(document).ready(function() { //execute slideshow, set 4 seconds each images slideshow(4000); }); function slideshow(speed) { //append li item ul list displaying caption $('ul.slideshow').append('<li id="slideshow-caption" class="caption"><div class="slideshow-caption-container"><h3></h3><p></p></div></li>'); //set opacity of images 0 $('ul.slideshow li').css({opacity: 0.0}); //get first image , display (set full opacity) $('ul.slideshow li:first').css({opacity: 1.0}); //get caption of first image rel attribute , display $('#slideshow-caption h3').html($('ul.slideshow a:first').find('img').attr('title')); $('#slideshow-caption p').html($('ul.slideshow a:first').find('img').attr('alt')); //display caption $('#slideshow-caption').css({opacity: 0.7, bottom:0}); //call gallery function run slideshow var timer = setinterval('gallery()',speed); //pause slideshow on mouse on $('ul.slideshow').hover( function () { clearinterval(timer); }, function () { timer = setinterval('gallery()',speed); } ); } function gallery() { //if no imgs have show class, grab first image var current = ($('ul.slideshow li.show')? $('ul.slideshow li.show') : $('#ul.slideshow li:first')); //get next image, if reached end of slideshow, rotate first image var next = ((current.next().length) ? ((current.next().attr('id') == 'slideshow-caption')? $('ul.slideshow li:first') :current.next()) : $('ul.slideshow li:first')); //get next image caption var title = next.find('img').attr('title'); var desc = next.find('img').attr('alt'); //set fade in effect next image, show class has higher z-index next.css({opacity: 0.0}).addclass('show').animate({opacity: 1.0}, 1000); //hide caption first, , set , display caption $('#slideshow-caption').slidetoggle(300, function () { $('#slideshow-caption h3').html(title); $('#slideshow-caption p').html(desc); $('#slideshow-caption').slidetoggle(500); }); //hide current image current.animate({opacity: 0.0}, 1000).removeclass('show'); } </script>
this editor not allowing script tags - placed @ top , bottom of each script
any appreciated! thanks,
if use jquery.noconflict();
(as know) must use jquery() instead of $()
or
jquery(document).ready(function($) { $(selectors).actions }
Comments
Post a Comment