jQuery conflict causing drop down menu to stop working
You can see what I am referring to here:
http://sneakylink.com/g
If you click on "home" you will see that the "Bikes" menu tab has a drop down menu. However, if you go to any of the bike pages - you will notice that the drop down menu doesn't work anymore.
It stopped working as soon as I added the image pan/zoom feature that you see on any of the bike pages.
Apparently there is a conflict somewhere.
I can either try to fix the conflict, or go with another option for the drop down menu.
Your thoughts? Any help would be greatly appreciated
For reference, here is the complete page code:
http://sneakylink.com/g
If you click on "home" you will see that the "Bikes" menu tab has a drop down menu. However, if you go to any of the bike pages - you will notice that the drop down menu doesn't work anymore.
It stopped working as soon as I added the image pan/zoom feature that you see on any of the bike pages.
Apparently there is a conflict somewhere.
I can either try to fix the conflict, or go with another option for the drop down menu.
Your thoughts? Any help would be greatly appreciated
For reference, here is the complete page code:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Electra Verse // Official Bikes of Nothing Official</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="css/supersized.css" />
<link rel="stylesheet" type="text/css" href="css/supersized.shutter.css" />
<script type='text/javascript' src='js/jquery.easing.min.js'></script>
<script type='text/javascript' src='js/supersized.3.2.6.min.js'></script>
<script type='text/javascript' src='js/supersized.shutter.min.js'></script>
<script type="text/javascript">
jQuery(function(jQuery){
jQuery.supersized({
slide_interval : 5000, //Length between transitions
transition : 1, //0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
transition_speed : 1000, //Speed of transition
random : 0,
performance : 1, //0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
image_protect : 0,
slides : [ //Slideshow Images
{image : 'images/bg_04.jpg'}]
//{image : 'images/bg_01.jpg'},{image : 'images/bg_02.jpg'},{image : 'images/bg_03.jpg'},{image : 'images/bg_04.jpg'},{image : 'images/bg_05.jpg'},{image : 'images/bg_06.jpg'},{image : 'images/bg_07.jpg'} ]
});
});
</script>
<link rel="stylesheet" href="css/scoller.css" type="text/css" media="screen" />
<script src="js/jcarousellite_1.0.1c4.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$(".newsticker-jcarousellite").jCarouselLite({
vertical: true,
hoverPause:true,
visible: 1,
auto:1000,
speed:2000
});
});
</script>
<link rel="stylesheet" href="css/jquery.superbox.css" type="text/css" media="all" />
<script type="text/javascript" src="js/jquery.superbox.js"></script>
<script type="text/javascript">
$(function(){
$.superbox.settings = {
closeTxt: "Close",
loadTxt: "Loading...",
nextTxt: "Next",
prevTxt: "Previous"
};
$.superbox();
});
</script>
<link rel="stylesheet" type="text/css" href="css/ddsmoothmenu.css" />
<link rel="stylesheet" href="css/LBstyle.css" />
<!--[if IE]><link rel="stylesheet" type="text/css" href="css/ie.css" /><![endif]-->
<script type='text/javascript' src='js/ddsmoothmenu.js'></script>
<script type='text/javascript' src='js/drop-down.js'></script>
<script type="text/javascript" src="js/tinybox.js"></script>
<style>
.smooth_zoom_preloader {
background-image: url(zoom_assets/preloader.gif);
}
.smooth_zoom_icons {
background-image: url(zoom_assets/icons.png);
}
</style>
<script src="zoom_assets/jquery-1.7.1.min.js"></script>
<script src="zoom_assets/jquery.smoothZoom.min.js"></script>
<script>
jQuery(function($){
$('#verse').smoothZoom({
width: 940,
height: 400
});
});
</script>
<script type="text/javascript" src="js/tinybox.js"></script>
<link rel="stylesheet" href="css/LBstyle.css" />
</head>
<body>
<div id="main">
<div id="header"><a href="index.html"><img src="images/logo.png" class="logo" alt="" /></a>
<div id="hed_right">
<div id="nav1"><a href="http://electrabike.com/uploads/pdf/Electra-Catalog-v19.pdf">Bike Catalog</a> <a href="http://electrabike.com/uploads/pdf/Electra-Life-Catalog-v19.pdf">Accessories Catalog</a> <a href="http://dealer.electrabike.com">Dealer Log-In</a>
<p>Follow Us On <span><a href="http://www.facebook.com/ElectraBicycleCompany"><img src="images/icon_01.png" alt="" /></a> <a href="http://www.linkedin.com/company/994641"><img src="images/icon_02.png" alt="" /></a> <a href="http://twitter.com/#!/electra_bicycle"><img src="images/icon_03.png" alt="" /></a></span></p>
</div>
<div class="ddsmoothmenu" id="smoothmenu1">
<ul>
<li><a href="index.html"><span><span>Home</span></span></a></li>
<li><a href="about-us.html"><span><span>Way to Roll</span></span></a></li>
<li><a href="#" class="select"><span><span>Bikes</span></span></a>
<ul>
<li><a href="verse.html">Verse</a></li>
<li><a href="ticino.html">Ticino</a></li>
<li><a href="amsterdam.html">Amsterdam</a></li>
<li><a href="townie.html">Townie</a></li>
<li><a href="cruiser.html">Cruiser</a></li>
<li><a href="kids.html">Kids</a></li>
</ul>
</li>
<li><a href="http://shops.electrabike.com/"><span><span>Dealers</span></span></a></li>
<li><a href="http://store.electrabike.com/eSourceTest/ecom/eSource/default/default.aspx"><span><span>Electra Store</span></span></a></li>
<li><a href="http://blog.electrabike.com/"><span><span>Blog</span></span></a></li>
<li><a href="contact-us.html"><span><span>Contact Us</span></span></a></li>
</ul>
</div>
</div>
</div>
<div id="body">
<div id="contact_body">
<h2>Verse</h2>
<div id="contact_left">
<h3>Rethink Fitness. </h3>
Our bikes aren't simply a means to get from here to there,
or a piece of equipment in your fitness regimen.
Introducing the Verse.
It's our entry to a category that's fairly conventional.
And fortunately, conventional isn't our strong suit.
So we infused our unique aesthetic into a fitness-oriented ride
to give you a bike with speed, versatility and good looks all in one
package. A bike that doesn't discriminate against agenda or attire.
A bike that asks you to rethink what you know about fitness riding.
<div class="rom_box1">
<h5>2013 Men's Verse<img src="images/bikes/195131_large.jpg" alt="" name="verse" id="verse" img /></h5>
<br />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. <span class="price">Find a Local dealer</span>
<url onclick="TINY.box.show({iframe:'http://dev.electrabike.com/electra/specs/verse/verse.html',boxid:'frameless',width:780,height:760,fixed:false,maskid:'bluemask',maskopacity:40,closejs:function(){closeJS()}})"><a href="#" class="read_more3">Full Specification Sheet</a></url>
<script type="text/javascript">
function openJS(){alert('loaded')}
function closeJS(){}
</script>
<ul>
<li>Shimano E-Z Fire Plus 24-Speed</li>
<li>Alloy Side-Pull Caliper w/ Quick Release</li>
<li>Available in Charcoal/Lava and Moss/Sage</li>
</ul>
<p> </p>
<div id="socialwidget"><img src="images/social.png" width="333" border="0" height="67" alt="Social Widget" /></div>
</div>
<div class="rom_box1"></div>
</div>
<div class="clear"></div>
</div>
</div>
<div class="clear"></div>
<div id="footer"><span><a href="contact-us.html">Support</a><img src="images/spacer.png" width="14" height="8" alt="Spacer" border="0" /><a href="flat.html">Flat Foot Technology</a><img src="images/spacer.png" width="14" height="8" alt="Spacer" border="0" /><a href="http://shops.electrabike.com">Find an Electra Dealer</a><img src="images/spacer.png" width="14" height="8" alt="Spacer" border="0" /><a href="technical.html">Technical</a><img src="images/spacer.png" width="14" height="8" alt="Spacer" border="0" /><a href="privacy.html">Privacy Policy</a> © 2012 Electra Bicycle Company, LLC. All rights reserved.</span></div>
</div>
</body>
</html>
Topic Participants
joe
Kevin Boudloche