登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

格林浪人 博客

一杯清茶常伴着我的孤寂,抚慰着一颗沉思的心!

 
 
 

日志

 
 

首页图片滚动效果的制作  

2010-06-15 07:41:44|  分类: 博客技巧 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |


      网易博客制作精品(一)

格林浪人制作 

     在网易博客中如何自定义图片展示效果

大家好:

    有朋友觉得我博客中的横向滚动图片比较好看,下面我就介绍一下如何进行设置。先看一下效果:

2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!

2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您! 2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!

    一、准备图片。

    1、我的这些图片都存放在我的相册中,分别是:(点击图片即可打开相册进行挑选)

 
2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!       2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!        2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!         2010年06月14日 - 格林浪人 - 格林浪人 欢迎您!

多数是一些动态图片,大小是128*128的。如果你只想美化首页,也可以直接链接这此图片。

    2、链接你自己的图片。你可以把自己喜欢的图片保存到自己的相册中,跟据图片的大小制定比较适合的“图片展示模块”的尺寸。比如放几张大的风景图滚动起来效果很好,那么你模块的高就需要跟据图片进行调整。

    3、友情链接。有的朋友把一些美女好友的头像和链接制作了进来也是一种很好的效果。

    二、网易博客HTML代码及相关参数。

    1、新建HTML模块,将下面代码复制到模块中,进行修改调试后保存。代码如下:

<DIV style=" WIDTH: 100%;">

<MARQUEE scrollAmount=3 scrollDelay=30 direction=left  width="100%" height="128">

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img457.ph.126.net/Y9J28GdKE5g6Ja-KjJmncA==/2491616493843737321.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img237.ph.126.net/pB99ZpKS1RBlkvTqnxKP8w==/1376975586070019152.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img.ph.126.net/v-zPQ8WsmqbBxZYAIo3B6A==/3274398404075321144.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img694.ph.126.net/zFxyW_PKIQmWbFlTcseGhQ==/59391220087020145.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img471.ph.126.net/UOVjj0xl_kCAOQDLSe_-Kg==/1002895342021140744.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img.ph.126.net/aHKDmTrPTIYWJ7oKmQrqOQ==/3231332732638635994.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img242.ph.126.net/RjUEI-6W_w5MMPZ25_9s5Q==/1429048456761155802.jpg" width=128 border=0></A>

<A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank><IMG height=128 src="http://img624.ph.126.net/TECJIfa-T4t04ok5acV7Yw==/1714464083145902074.jpg" width=128 border=0></A>
</MARQUEE></DIV>

     2、这组命令各参数的调整。

    direction=left 这是图片的滚动方向,可以有四个方向,分别是left   right   up   down

     width="100%" height="128" 这是模块整体的宽和高,在网易博客中宽度就设定为100%不用变,可以跟据你模块摆放的位置自适应。高度可以跟据你需要进行调整。

     <A href="http://ahglnr.blog.163.com/prevAlbumsInUser.do#p1" target=_blank> 第一张图片前的这组代码和以后图片前的<A>是同一组代码,区别是加入了 href=""是点击图片打开指定链接网页,你可以把我的首页换成你想链接的地址,更可以在后面的图片上都加上链接。 target=_blank 是在新窗口打开的意思,没有这个命令就是在当前页打开。

     src="http://img457.ph.126.net/Y9J28GdKE5g6Ja-KjJmncA==/2491616493843737321.jpg"是调用这个链接地址的图片,你需要把你想展示的图片地址找到,并进行替换。

     第一个图片链接后面都有一个 width=128是这张图片的宽度,是需要你跟据自己的图片大小进行调整的。

有朋友留言对于一些教程看不明白,现将最基础的装扮文章整理出来,供你参考

 

最    新高山流水Flash演示及代码 - 格林浪人 - 格林浪人 欢迎你! 

 
漂亮的七色分割线 - 格林浪人的博客

更多精彩内容,点击格林浪人日志链接浏览!          

  评论这张
 
阅读(494)| 评论(1)

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018