nivoslider与花式盒子相冲突

时间:2013-01-02 14:09:33

标签: javascript jquery fancybox

我最近在我的网站上安装了最新的Nivo Slider。 www.desireandpleasure.co.uk/shop但是,现在我的fancybox弹出警告不会显示。

我假设它有冲突的javascript,我不知道从哪里开始。任何人都有任何想法或有同样的问题,因为我已经看到了其他问题,但没有任何具体的问题。

干杯。

以下是fancybox代码:

    <style type="text/css">
<!--
.style3 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
}
.style4 {font-size: 12px}
.style5 {color: #6600FF}
.style9 {color: #6600FF; font-size: 16px; }
-->
</style>
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher: "fbe78afe-9290-4572-880f-7dfb2e0b0ec3"});</script>
<script type="text/javascript">
    var    image_loading      = '<?php echo $tmpl['img']['cart_loading']; ?>';
    var    image_width        = '<?php echo $tmpl['img']['cart_width']; ?>';
    var    image_height       = '<?php echo $tmpl['img']['cart_height']; ?>';
    var    text_cart_quantity = '<?php echo $tmpl['txt']['cart_qty']; ?>';
    var    text_cart_subtotal = '<?php echo $tmpl['txt']['cart_subtotal']; ?>';
    var    text_cart_empty    = '<?php echo $tmpl['txt']['cart_empty']; ?>';
    var    cart_text          = '<?php echo $tmpl['txt']['cart_text']; ?>';
    var    cart_link          = '<?php echo $tmpl['url']['cart']; ?>';
    var    session_id         = '<?php echo $tmpl['session_param']; ?>';
    var    fetch_url          = '<?php echo $tmpl['url']['cart_fetch']; ?>';

    function createCookie(name,value,days) {
      if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
      }
      else var expires = "";
      document.cookie = name+"="+value+expires+"; path=/";
    }

    function readCookie(name) {
      var nameEQ = name + "=";
      var ca = document.cookie.split(';');
      for(var i=0;i < ca.length;i++) {
              var c = ca[i];
              while (c.charAt(0)==' ') c = c.substring(1,c.length);
              if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
      }
      return null;
    }

    function eraseCookie(name) {
      createCookie(name,"",-1);
    }
</script>
<script type="text/javascript" src="<?= TMPL_JS ?>jquery.js"></script>
<script type="text/javascript" src="<?= TMPL_JS ?>animebox.js"></script>                                                                                          
<script type="text/javascript" src="http://www.desireandpleasure.co.uk/shop/templates/OS04A00404/az_template/fancybox/jquery.fancybox-1.2.6.pack.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.desireandpleasure.co.uk/shop/templates/OS04A00404/az_template/fancybox/jquery.fancybox-1.2.6.css" media="screen" />
<style type="text/css">
  #fancy_outer { top: 50px!important; }
</style>
<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery("a#popupcontroller").fancybox({
    'showCloseButton'    : false,
    'hideOnOverlayClick' : false,
    'hideOnContentClick' : false,      
    'frameHeight'        : 480,
    'frameWidth'         : 705, 
    'overlayOpacity'     : 0.9,
    'overlayColor'       : '#101',    
    'autoDimensions'     : false,
    'centerOnScroll'     : false,
    'onComplete': function() { 
      jQuery("#fancy_outer").css({ 
       'top': '50px!important' 
       }); 
      }                      
  });

  var cookie = readCookie('over18');                

  if (cookie != 'true'){                        
    if (window.location.pathname == '/shop/' || window.location.pathname == '/shop/index.html'){
      jQuery("a#popupcontroller").click();  
    }                                       
  } 
  eraseCookie('over18');      
});

</script>

这是我的Nivo代码:

<div id="wrapper">

        <div class="slider-wrapper theme-default">
            <div id="slider" class="nivoSlider">
                <img src="sliderfront.png" data-thumb="sliderfront.png" alt="" width="725px"/>
                <img src="image002.jpg" data-thumb="image002.jpg" alt="" width="725px"/></a>
                <img src="image003.jpg" data-thumb="image003.jpg" alt="" data-transition="slideInLeft" width="725px"/>
            </div>
        </div>

    </div>

1 个答案:

答案 0 :(得分:0)

在定义nivoslider或fancybox时尝试使用this函数。我认为它可以帮助你。

jQuery.noConflict();
jQuery(document).ready(function() {
  jQuery("a#popupcontroller").fancybox({
    'showCloseButton'    : false,
    'hideOnOverlayClick' : false,
    'hideOnContentClick' : false,      
    'frameHeight'        : 480,
    'frameWidth'         : 705, 
    'overlayOpacity'     : 0.9,
    'overlayColor'       : '#101',    
    'autoDimensions'     : false,
    'centerOnScroll'     : false,
    'onComplete': function() { 
      jQuery("#fancy_outer").css({ 
       'top': '50px!important' 
       }); 
      }                      
  });

但是请确保在noConflict中使用jQuery。在另一种情况下,您应该使用“$”