首页图片滚动效果的制作
网易博客制作精品(十一)
在网易博客中如何自定义图片展示效果
大家好:
有朋友觉得我博客中那四组横向滚动的图片比较好看,下面我就介绍一下如何进行设置。先看一下效果:
一、准备图片。
1、我的这些图片都存放在我的相册中,分别是:(点击图片即可打开相册进行挑选)
共几千张,多数是一些动态图片,大小是128*128的。如果你只想美化首页,也可以直接链接这此图片。
2、链接你自己的图片。你可以把自己喜欢的图片保存到自己的相册中,跟据图片的大小制定比较适合的“图片展示模块”的尺寸。比如放几张大的风景图滚动起来效果很好,那么你模块的高就需要跟据图片进行调整。
3、友情链接。有的朋友把一些美女好友的头像和链接制作了进来也是一种很好的效果。
二、网易博客HTML命令及相关参数。
1、新建HTML模块,将下面命令复制到模块中,进行修改调试后保存。命令如下:
<DIV style=" WIDTH: 100%"> <MARQUEE scrollAmount=2 scrollDelay=30 direction=left width="100%" height="128"><A href="http://wlpx.blog.163.com/blog/static/16810420200723113738165/" target=_blank><IMG height=128 src="http://img.blog.163.com/photo/Y1-4whLQBVJ4XR98N01d5A==/898468125660489439.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/8ADQsw9wIW2ZAqi8Qz6wgg==/1723752757376242311.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/kI1qVPv1C1on8kvzrFpNfQ==/4268849496794245535.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/bcmH88e03HdlCmvVlyrzVw==/2038723256315393985.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/v-4MW80VUWRTzXz34nFEdw==/1754996479791295019.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/K-a1I4CWkM7wfbTIoxs-VQ==/447826687946764096.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/-IlOX6V8Rrmyrn3wzDWXtg==/3451164689449796509.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/0XccelbbFk5bTQaX3qHD2Q==/2266155037497742081.jpg" width=128 border=0></A><A><IMG height=128 src="http://img.blog.163.com/photo/NaamXbkyoAP7XzY9w2qi7w==/329607197728251088.jpg" width=128 border=0></A></MARQUEE></DIV>
2、这组命令各参数的调整。
direction=left 这是图片的滚动方向,可以有四个方向,分别是left right up down
width="100%" height="128" 这是模块整体的宽和高,在网易博客中宽度就设定为100%不用变,可以跟据你模块摆放的位置自适应。高度可以跟据你需要进行调整。
<A href="http://wlpx.blog.163.com/blog/static/16810420200723113738165/" target=_blank> 第一张图片前的这组命令和以后图片前的<A>是同一组命令,区别是加入了 href=""是点击图片打开指定链接网页,你可以把我的首页换成你想链接的地址,更可以在后面的图片上都加上链接。 target=_blank 是在新窗口打开的意思,没有这个命令就是在当前页打开。
src="http://img.blog.163.com/photo/Y1-4whLQBVJ4XR98N01d5A==/898468125660489439.jpg"是调用这个链接地址的图片,你需要把你想展示的图片地址找到,并进行替换。如果你不知道怎么去找你相册中图片的链接地址,那么你看一下我的这篇文章。关于网络像册
第一个图片链接后面都有一个 width=128是这张图片的宽度,是需要你跟据自己的图片大小进行调整的。
我给大家推荐一个非常适合网易博客用户使用的互动工具
你的倩影互踩=互踩+宣传+更精彩的美化+更自由的管理
简单说一下功能:这是一款博客辅助工具,也是博客朋友互动的场所,更是帮你实现将你的网易文章形成更广泛的美化与管理的空间。
你的倩影互踩为你提供了包括:
一、分地区分年龄用户的互踩查询!
二、使用CSS命令达到对你的新空间的终级美化!
三、文章的自动转发,无需你过多管理,更加体现出为你网易博客宣传和服务的特性!
四、可以添加广告代码,把流量换成钱也是很简单的事情!
这里不多介绍了,我有空专门写一篇介绍。
加入你的倩影互踩点这里进入,然后注册并激活即可。
有朋友留言对于一些教程看不明白,现将最基础的装扮文章整理出来,供你参考
最新版网易博客装饰新人教程
如何使用网易博客相册
网易博客代码
博客新手上路的基本方法
有2人推荐
上一篇:
下一篇: