我正在使用jQuery插件。弹出框将显示,但当您点击一个时,它们都会显示出来。
我试图一次只显示一个方框,但它们都跨越整个页面。
感谢任何帮助。
这是代码。
jQuery.fn.jqueryPop = function(options) {var settings = jQuery.extend({ popWidth: 251, popInSpeed: 300, popInSpeed: 100, popClass: ".contentPop", popIndex: 1000 }, options); $(this).toggle(function(){ $(settings.popClass).css('zIndex', settings.popIndex); $(settings.popClass).width(settings.popWidth); $(settings.popClass).height(settings.popHeight); $(settings.popClass).fadeIn(settings.popInSpeed); $(this).addClass('active'); },function(){ $(settings.popClass).fadeOut(settings.popOutSpeed); $(this).removeClass('active'); }); };
<script type="text/javascript">
$(document).ready(function(){
$('.jqueryPop').jqueryPop();
});
</script>
我的HTML
<span class="highlight"><a href="" class="jqueryPop">Savannah</a></span>
<div class="contentPop"> <p><b>OMG WOW!</b> <br /> Embed anything you want, movies, photos, etc... </p>
<p>It even has options for awesome flexibility!</p> </div>