0

我正在使用这个 http://jsfiddle.net/vRqcb/11/

我已经在一个使用这个 CSS 的 jquery 弹出框中实现了它：

#element_to_pop_up { 
    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    padding:20px;
    min-width:700px;
    min-height: 500px;
}

见这里：http ://www.pazzle.co.uk/index.php?main_page=product_info&cPath=6_11&products_id=8#.UIpb2cWlUYM

在“添加到购物车”按钮下方，显示“查看尺寸表”。点进去可以看到有点变形，CSS和JSfiddle一模一样？

也许是因为它在弹出脚本中？

编辑：

<!-- Element to pop up -->
<div id="element_to_pop_up">
<script language="javascript">
$(document).ready(function() {    

$('#tabs li a:not(:first)').addClass('inactive');
$('.container').hide();
$('.container:first').show();

$('#tabs li a').click(function(){
    var t = $(this).attr('id');
  if($(this).hasClass('inactive')){ //this is the start of our condition 
    $('#tabs li a').addClass('inactive');           
    $(this).removeClass('inactive');

    $('.container').hide();
    $('#'+ t + 'C').fadeIn('slow');
 }
});

});
</script>
    <a class="bClose">x<a/>

<ul id="tabs">

      <li><a id="tab1">test1</a></li>
      <li><a id="tab2">test2</a></li>
      <li><a id="tab3">test3</a></li>
      <li><a id="tab4">test4</a></li>
</ul>
          <div class="container" id="tab1C">1Some content</div>
          <div class="container" id="tab2C">2Some content</div>
          <div class="container" id="tab3C">3Some content</div>
          <div class="container" id="tab4C">4Some content</div>
</div>
4

2 回答 2

0

的第一个中有一个双<a>标签，第一个将第二个向下推。<li>ul#tabs<a><a>

于 2012-10-26T09:58:25.007 回答
0

我非常确信您在 jsfiddle 中使用的 Javascript 与您在网站上使用的不同。

我在第一个 li 中看到了一个额外的锚标记。

<ul id="tabs"><a>

      </a><li><a></a><a id="tab1" class="inactive">test1</a></li>
      <li><a id="tab2" class="inactive">test2</a></li>
      <li><a id="tab3" class="inactive">test3</a></li>
      <li><a id="tab4" class="inactive">test4</a></li>

</ul>

您还看到“非活动”类应用于所有 li，而根据您的代码，它不应该应用于第一个元素。因此，当您的 javascript 运行时，这个锚标记肯定存在。

于 2012-10-26T09:56:42.980 回答