我想在投资组合部分的缩略图上实现动画，如下面的模板所示。
http://ironsummitmedia.github.io/startbootstrap-freelancer/#
我原计划通过在mouseenter（）和mouseleave（）上使用Jquery交换图像src来实现它。
$(".pictures .thumbnail").mouseenter ( function () {
$(this).attr("src","glass.png");
});
我无法找到存储鼠标指向的原始缩略图的src的方法，以便我可以在mouseleave（）函数上使用它。
缩略图的html代码，以防万一。
<div class = "pictures ">
<div class = "container ">
<div >
<center><b><text>PORTFOLIO</text></b></center>
</div>
<div class = "pics">
<div class = "column">
<div class = "col-md-4">
<div class = "thumbnail">
<img src = "cabin.png">
</div>
<div class = "thumbnail">
<img src = "cake.png">
</div>
</div>
</div>
<div class = "column">
<div class = "col-md-4">
<div class = "thumbnail">
<img src = "circus.png">
</div>
<div class = "thumbnail">
<img src = "game.png">
</div>
</div>
</div>
<div class = "column">
<div class = "col-md-4">
<div class = "thumbnail">
<img src = "safe.png">
</div>
<div class = "thumbnail">
<img src = "submarine.png">
</div>
</div>
</div>
</div>
</div>
</div>
关于如何做到这一点的任何想法？ 提前谢谢！
答案 0 :(得分：1)
在library(dplyr)
plotpg19 <- mutate(plotpg19, xtext = sequence + 0.55)
library(ggplot2)
ggplot(plotpg19, aes(x = sequence, y = scores)) +
geom_bar(stat = "identity", width = 0.4) +
coord_flip() +
labs(x = "", y = "") +
theme_bw() +
theme(axis.text.y = element_blank(), axis.ticks.y = element_blank()) +
geom_text(data = plotpg19,
aes(x = xtext, y = 0, label = risks, size = 5, show_guide = FALSE),
hjust = 0, vjust = 1) +
guides(size = FALSE)
元素上添加data属性。
<img>答案 1 :(得分：1)
这将按预期工作：
$('.pictures .thumbnail img').on('mouseenter mouseleave', function(event){
var originalimage = $(this).attr("src");
$(this).attr("src", $(this).attr("data-src"));
$(this).attr("data-src", originalimage);
});