0

对象：我有一个标题标题，我只想用图像徽标替换其中的一个字母。

问题：在使用<span>它以某种方式破坏了我的设计之后，我的意思是它断线，没有正确替换字母但出现在其他地方。我知道这是定位，但很多方法都直接付诸东流。有人有想法吗？

我的脚本，非常基本：

<script type="text/javascript">
      $(function() {
            $('#logo span').fadeOut(7000);
            $('#logo span 2').fadeIn(2000);
      });
    </script>

我的CSS：

 <style>
     #logo .span 2 {display:none}
    </style>

我的html：

<!-- Header & Call to Action Area -->
<div id="logo"><a href="index.html">Mundo<img class="logo" src="pictures/logos/logo_mundo_krone_header.png" width="100" height="56" alt="logo kundo gourmet puerto varas,restaurant puerto varas,puerto varas lujo,extravagante puerto varas" /><br />Gour<span><span class="2"><img src="pictures/logos/logo_mundo_krone_header.png" width="100" height="56" /></span>m</span>et</a></div>
4

1 回答 1

1

啊...我知道这里出了什么问题。你是说span 2，字面意思。这不是一个有效的选择器。您需要做的是以下内容。

$('#logo span').eq(0).fadeOut(7000);

jQuery 使用从零开始的索引。在这里，我们告诉 jQuery 我们希望第一个 span 淡出。

$('#logo span').eq(1).fadeIn(2000);

在这里，我们告诉第二个跨度淡入。

一般来说，这些类型的效果是使用组合在一起的callback functions。

$('#logo span').eq(0).fadeOut(7000, function(){
    //this is the callback function.
    //when the above fade completes, anything in here will run immediately after.
    $('#logo span').eq(1).fadeIn(2000);
});

作为对未来来到这里的任何人的旁注

我使用了 jQuery 的.eq()嘶嘶声选择器，而不是 jQuery 的:eq()jQuery 选择器。原因是sizzle selectors可以利用querySelectorAll()方法，其中 purejQuery selectors必须遍历 DOM 才能找到元素。尽管对于上面的示例，这可能不会节省太多，但总的来说，如果您进行大量遍历，则此关键说明很重要。

于 2012-09-29T02:08:14.443 回答