文章/答案/技术大牛

发布

问jQuery变量函数不能运行
EN

Stack Overflow用户

提问于 2013-09-07 20:26:04

回答 2查看 81关注 0票数 0

我试图在HTML中创建框，如果您悬停在它们上面，框中的图标会在消失时旋转，而在它的位置上，另一个img会逐渐消失，但不会旋转。好吧，我已经开始工作了，但是有太多的代码，我试图创建一个函数，这样我的代码就会少一些。我一直找不到答案，这是代码。我不想

http://jsfiddle.net/SSZVN/

这是代码，如果您只需要这样告诉我：

<div id="info-boxes">
  <div class="box b-one">
    <span class="rotate">
      <center><img src="images/house.png" alt="" title="Stability" class="rotata" /></center>
      <center><img src="images/house-h.png" alt="" title="Stability" class="rotati" /></center>
    </span>
    <h2>Stable & Secure</h2>
    <p>Lorem ipsum dolor sit amet,consectetura
      dipiscing elit. Donec porta diam
      massa. Fusce molestie nisl in posuere 
      fermentum.</p>
    <center><a href="#" class="button-blue">More Info</a></center>
  </div>
  <div class="box b-two">
    <span class="rotate">
      <center><img src="images/note.png" alt="" title="Realiablity" class="rotata" /></center>
      <center><img src="images/note-h.png" alt="" title="Realiablity" class="rotati" /></center>
    </span>
    <h2>Reliable Information</h2>
    <p>Lorem ipsum dolor sit amet,consectetura
      dipiscing elit. Donec porta diam
      massa. Fusce molestie nisl in posuere 
      fermentum.</p>
    <center><a href="#" class="button-green">More Info</a></center>
  </div>
  <div class="box b-thr">
    <span class="rotate">
      <center><img src="images/power.png" alt="" title="Savability" class="rotata" /></center>
      <center><img src="images/power-h.png" alt="" title="Savability" class="rotati" /></center>
    </span>
    <h2>Power Saver</h2>
    <p>Lorem ipsum dolor sit amet,consectetura
      dipiscing elit. Donec porta diam
      massa. Fusce molestie nisl in posuere 
      fermentum.</p>
    <center><a href="#" class="button-red">More Info</a></center>
  </div>
</div>

jQuery：

var spinMe = function(nameSpin) {
    $(nameSpin).hover(
        function() {
            $(this).children('.rotata').fadeOut('slow');
        }, function() {
            $(this).children('.rotata').fadeIn('slow');
        }
    );
    $(nameSpin).hover(
        function() {
            $(this).hasClass('.rotati').fadeIn('slow');
        }, function() {
            $(this).hasClass('.rotati').fadeOut('slow');
        }
    );
};
spinMe('#info-boxes .box');

javascript

jquery

html

css

function

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-09-07 21:04:38

我会改变讣告的引用。

    $(this).find('img.rotata').fadeOut('slow').fadeIn('slow');

    and

    $(this).find('img.rotati').fadeIn('slow').fadeOut('slow');

不过，我不得不从您的小提琴中删除一些JS代码(当然没有保存)，因为我得到的JS错误妨碍了您的旋转代码的工作。一旦我删除了这个问题，引用就不正确了。所以我把它改成了上面的。

票数 0

Stack Overflow用户

发布于 2013-09-07 20:36:20

试一试

$(this).children('.rotata').each(function () {
  $(this).fadeOut('slow');
});

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/18677608

复制

相似问题

问jQuery变量函数不能运行
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery变量函数不能运行EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery变量函数不能运行
EN