超级菜单:http://www.geektantra.com/projects/jquery-megamenu-2/
下面是这个问题的一个小示例:http://kennylam.net/WIP/sandbox/example1/index.html
问题是,当colorbox作为iframe从直接链接调用时,它工作得很好。然而,当我尝试从megamenu下拉列表中调用它时,它只是打开页面而不是使用colorbox。我已经看过代码了,但我自己对Javascript不太在行。
有没有人能看看发生了什么事?
谢谢。
发布于 2012-02-18 16:35:54
试试这个:
<head>
<meta charset='utf-8'/>
<title>ColorBox Examples</title>
<style>
body{font:12px/1.2 Verdana, sans-serif; padding:0 10px;}
a:link, a:visited{text-decoration:none; color:#416CE5; border-bottom:1px solid #416CE5;}
h2{font-size:13px; margin:15px 0 0 0;}
</style>
<link rel="stylesheet" href="colorbox.css" />
<link rel="stylesheet" href="../stylesheets/jquery.megamenu.css" type="text/css" media="screen" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="../colorbox/jquery.colorbox.js"></script>
<script src="../javascripts/jquery.megamenu.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
//why not move the megamenu includes (the css and js files) above and init it here
$(".megamenu").megamenu();
//now try to bind the colorbox
//this is the one that is being used on your example page
$(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
//if that is still not working you may have to unbind the click function from the a tag inside the mega menu
});
</script>
</script>
</head>
<body>
<h1>ColorBox Demonstration</h1>
<p><a class='iframe' href="http://threadless.com">Outside Webpage (Iframe)</a></p>
<ul class="megamenu">
<li>
<a href="javascript:void(0)">Colorbox within megamenu</a>
<div style="width: 500px;">
<p><a class='iframe' href="http://threadless.com">Outside Webpage (Iframe)</a></p>
</table>
</div>
</li>
</ul>
</body>https://stackoverflow.com/questions/9339404
复制相似问题