我正在使用jQuery但它在我的网页中无效。 jquery-1.10.2.min.js用于TAB和jquery.lightbox-0.5.js"用于带有jquery.js脚本文件的照片库。 现在虽然它显示了标签按钮和图库的缩略图,但当我点击标签时,标签不起作用,照片库也不起作用。
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.opacityrollover.js" type="text/javascript"></script>
<!--[if lt IE 7]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5.js"></script>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen">
<![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />
<!-- / fim dos arquivos utilizados pelo jQuery lightBox plugin -->
<!-- Ativando o jQuery lightBox plugin -->
<script type="text/javascript">
$(function() {
$('#photog a').lightBox();
});
</script>
<style type="text/css">
/* jQuery lightBox plugin - Gallery style */
</head>
<body id="page1">
<!--==============================header=================================-->
<header>
<div class="row-2">
<div class="main">
<div class="container_12">
<div class="grid_9">
<div id="logom">
<img src="images/logo-iie.png" width="43" height="54" alt="IIE LOGO" />
</div>
<h1>
<a class="logo" href="index.html">Indian Institute of Entrepreneurship</a>
<span>Clusters in North East Region</span>
</h1>
An Organisation of the Ministry Of Micro, Small and Medium Enterprises(MSME),<br>
Govt.of India
An ISO 9001:2008 Certified Organisation
</div>
<div id="logor"><img src="images/logo-rrc.png" width="51" height="54" alt="IIE LOGO" /></div>
</div>
<div class="clear"></div>
</div>
</div>
<div class="row-1">
<div class="main">
<div class="container_12">
<div class="grid_12">
<!-- Main navigation -->
<nav class="main-navigation clearfix span12" role="navigation">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="team.html">RRC Team</a></li>
<li>
<a href="clusters.html">Clusters</a>
<ul class="sub-menu">
<li><a href="#">Assam</a>
<ul class="sub-menu">
<li><a href="#">Sipajhar Handloom Cluster</a></li>
<li><a href="#">Dhamdhama Handloom Cluster</a></li>
<li><a href="#">Pyranga Eri Cluster</a></li>
<li><a href="#">Rontholi Jewellery Cluster</a></li>
<li><a href="#">Bogulamari Jute Cluster</a></li>
<li><a href="#">Asharikandi Terracotta Cluster</a></li>
<li><a href="#">Japi Cluster</a></li>
<li><a href="#">Incense Sticks cluster</a></li>
</ul>
</li>
<li><a href="#">Manipur</a>
<ul class="sub-menu">
<li><a href="#">Kouna Grass Cluster</a></li>
<li><a href="#">Imphal Handloom Cluster</a></li>
<li><a href="#">Greater Imphal Jewellery Cluster</a></li>
</ul>
</li>
<li><a href="#">Mizoram</a>
<ul class="sub-menu">
<li><a href="#">Baktwang Wood Carpentry Cluster</a></li>
<li><a href="#">Bairabi Bamboo cluster</a></li>
</ul>
</li>
<li><a href="#">Sikkim</a>
<ul class="sub-menu">
<li><a href="#">Okhrey Carpet Making Cluster</a></li>
</ul>
</li>
<li><a href="#">Tripura</a>
<ul class="sub-menu">
<li><a href="#">Hapania Jute Cluster</a></li>
</ul>
</li>
<li><a href="#">Meghalaya</a>
<ul class="sub-menu">
<li><a href="#">Strawberry Cluster, Ri-Bhoi</a></li>
<li><a href="#">Umden Eri Cluster</a></li>
<li><a href="#">Cashew Nut Cluster, Selsela</a></li>
</ul>
</li>
<li><a href="#">Arunachal Pradesh</a>
<ul class="sub-menu">
<li><a href="#">Tawang Carpet Making Cluster</a></li>
<li><a href="#">Dirang Food Processing Cluster</a></li>
</ul>
</li>
</ul>
</li>
<li class="current"><a href="gallery.html">Photo Gallery</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav> <!-- #main-navigation -->
</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</header>
<!-- content -->
<section id="content">
<div class="bg-top">
<div class="bg-top-2">
<div class="bg">
<div class="bg-top-shadow">
<div class="main">
<div class="gallery p3">
<div class="wrapper indent-bot">
<span class="title img-indent3">Gallery</span>
<div class="cleaner_h10"> </div>
<!--------------------------------------->
<div id="w" class="clearfix">
<ul id="sidemenu">
<li>
<a href="#assam-content" class="open"><i class="icon-info-sign icon-large"></i><strong>Assam</strong></a>
</li>
<li>
<a href="#manipur-content"><i class="icon-lightbulb icon-large"></i><strong>Manipur</strong></a>
</li>
<li>
<a href="#mizoram-content"><i class="icon-envelope icon-large"></i><strong>Mizoram</strong></a>
</li>
<li>
<a href="#sikkim-content"><i class="icon-envelope icon-large"></i><strong>Sikkim</strong></a>
</li>
<li>
<a href="#tripura-content"><i class="icon-envelope icon-large"></i><strong>Tripura</strong></a>
</li>
<li>
<a href="#meghalaya-content"><i class="icon-envelope icon-large"></i><strong>Meghalaya</strong></a>
</li>
<li>
<a href="#arunachal-content"><i class="icon-envelope icon-large"></i><strong>Arunachal</strong></a>
</li>
</ul>
<div id="contab">
<div id="assam-content" class="contabblock">
<h1>Assam</h1>
</div><!-- @end -->
<div id="manipur-content" class="contabblock hidden">
<h1>Manipur</h1>
</div><!-- @end -->
<div id="mizoram-content" class="contabblock hidden">
<h1>Mizoram</h1>
</div><!-- @end -->
<div id="sikkim-content" class="contabblock hidden">
<h1>Sikkim</h1>
</div><!-- @end -->
<div id="tripura-content" class="contabblock hidden">
<h1>Tripura</h1>
</div><!-- @end -->
<div id="meghalaya-content" class="contabblock hidden">
<h1>MIzoram</h1>
</div><!-- @end -->
<div id="arunachal-content" class="contabblock hidden">
<h1>Arunachal Pradesh</h1>
</div><!-- @end -->
</div><!-- @end #content -->
</div><!-- @end #w -->
<!--------------------------------------->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--==============================footer=================================-->
<footer>
<div class="main">
<div class="container_12">
<div class="wrapper2">
<div class="grid_4">
<div>© 2014 All right reserved</div>
<!-- {%FOOTER_LINK} -->
</div>
<div class="grid_4">
<div>Powered by: Third Eye</div>
</div>
<div class="grid_4">
<ul class="list-services">
<li><a href="#"></a></li>
<li><a class="item-2" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<script type="text/javascript">
$(function(){
$('#sidemenu a').on('click', function(e){
e.preventDefault();
if($(this).hasClass('open')) {
// do nothing because the link is already open
} else {
var oldcontent = $('#sidemenu a.open').attr('href');
var newcontent = $(this).attr('href');
$(oldcontent).fadeOut('fast', function(){
$(newcontent).fadeIn().removeClass('hidden');
$(oldcontent).addClass('hidden');
});
$('#sidemenu a').removeClass('open');
$(this).addClass('open');
}
});
});
</script>
</body>
</html>
答案 0 :(得分:0)
我真的不知道你的脚本是做什么的,但只是通过阅读它我看到了这个问题:
var oldcontent = $('#sidemenu a.open').attr('href');
var newcontent = $(this).attr('href');
所以oldcontent
和newcontent
是一串包含链接(URL)的字符串,如&#34; http://....."等。
然后你试图制作那些&#34;字符串&#34;褪色:
$(oldcontent).fadeOut('fast', function(){
$(newcontent).fadeIn().removeClass('hidden');
$(oldcontent).addClass('hidden');
});
我认为两者之间缺少某些东西......