图画在鼠标经过时改变

我发现,在部落格设置了这个之后,看部落格图画/照片变得超级方便!通常当我们要看完整、放大的图画,我们都会按那个图画,然后该图画就会出现在另外一个 窗口( window)里。我个人觉得这样很麻烦咯,因为一直要关掉新的窗口,而且又 load 到很慢。= = 所以很多时候就懒惰放大图片来看。现在分享的教程,让你的图片只要用滑鼠按,就能放大。这样的话能方便你的读者。效果例子请按以下的图片:



现在来分享怎样弄 :)

1。到 Design > Add a Gadget > HTML/Java Script

2。把以下的 code copy and paste 进去:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

<script src="
http://www.yourjavascript.com/610310434009/unwanted86.blogspot.com.js" type="text/javascript">
</script>





3。按 save。好啦,现在最基本的 code 已经设置好了。现在你要做的就是把这个效果放在照片上。先把你的照片上载到 Photobucket。当你写帖子时,到 edit HTML,把以下的 code paste 进去:


<img src="图画 URL/Direct Link" class="magnify" data-magnifyby="2" style="width:200px; height:150px cursor: url(magnify.cur), -moz-zoom-in; " />


把 图画 URL/Direct Link 换成你要放大的图画的 URL 或者是 Direct Link。
黄色highlight 的号码是你要图片放大的尺寸。
青色号码是图片的 size。可以随意更改。


4。添加你的帖子内容。按 Publish。好啦。:) 路过:)谢谢阅读:)更新了记得回来看蛤:DD

No comments:

Post a Comment