以9Gag风格显示GIF图像

时间:2014-05-17 14:30:42

标签: javascript php jquery css

我想知道如何在单击JPG文件后显示GiF文件,就像在9Gag.com中一样

我使用timthumb.php作为JPG图片。

https://code.google.com/p/timthumb/

以下是代码

<div class="images">
<img alt="Image Title" src="timthumb.php?src=MyImage.jpg&amp;w=500&amp;q=100">
</div>

我想在点击此JPG后显示原始图像。任何人都可以指出我使用jQuery或JavaScripts做到这一点。

注意:这是一个图像循环,因此可以有多个图像。

非常适合你的帮助。

1 个答案:

答案 0 :(得分:1)

这可以使用jQuery库来完成 的 HTML

<div class="images">
    <img class="thumb" alt="Image Title" src="http://i.stack.imgur.com/ruR4z.png" gif="http://ourbunkers.0catch.com/grunt.gif"/>
    <img class="thumb" alt="Image Title" src="http://i.stack.imgur.com/ruR4z.png" gif="http://ourbunkers.0catch.com/grunt.gif"/>
    <img class="thumb" alt="Image Title" src="http://i.stack.imgur.com/ruR4z.png" gif="http://ourbunkers.0catch.com/grunt.gif"/>
</div>

<强>的Javascript

$(".thumb").click( function(){ 
    $(this).attr("src", $(this).attr("gif")); 
});

http://jsfiddle.net/PP42Q/8/