文章/答案/技术大牛

发布

社区首页 >问答首页 >jQuery使用ImageMapper替换图片

问jQuery使用ImageMapper替换图片
EN

Stack Overflow用户

提问于 2013-04-23 00:35:13

回答 1查看 348关注 0票数 0

我正在努力提高我对Javascript、jQuery和ImageMapster插件的理解。为了便于解释，我正在编写here's the jsFiddle。

在jsFiddle代码中，每个披头士的脸在悬停时都是红色的边框。但超文本标记语言还包括每个披头士乐队(style="display:none")的隐藏图像，我希望当用户的鼠标移到相应披头士的脸上时，这些图像可以显示在合影上方。

也就是说，当我将鼠标移到Paul的脸上时，Paul的照片应该会出现。当移出Paul时，合影再次出现。当移动到Ringo的脸部上方时，Ringo的特写就会出现。坦率地说，无论是集体照片消失还是个人照片出现，或者是独立照片叠加在集体照片上，对我来说都无关紧要--我似乎不能让这两种情况发生。

我已经尝试了无数的东西，但javascript对我来说无能为力。我希望在正确的方向上能有一个温和的推动(或者直接的演示)。

对于那些读到这里的读者，我也不理解ALL data-key是如何工作的:我添加了一个all标题，但它不会显示。我试图使标题显示时，鼠标在集体照片上，而不是在任何特定的面孔(即当所有面孔突出显示为白色)。

我的问题是基于this的原始ImageMapper演示。

javascript

jquery

imagemapster

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-04-23 00:54:29

我已经更新了你的小提琴：http://jsfiddle.net/qLakz/8/ -这是我添加的代码：

var currentPerson;
$('area').hover(
    function(){
        currentPerson = $('#just-'+$(this).data('name'));
        currentPerson.fadeIn();
    }, function(){
        currentPerson.hide();
    }
);

.data()的jquery文档页面在这里：http://api.jquery.com/data/ -它有大量的例子，所以它应该能帮助你更好地理解。

票数 1

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

原文链接：

https://stackoverflow.com/questions/16152190

复制

相似问题

问jQuery使用ImageMapper替换图片
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery使用ImageMapper替换图片EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery使用ImageMapper替换图片
EN