banner制作初级的教程.docx

banner制作初级教程 ? 放置banner的方法简单说就是制作一张和自己主页原顶图尺寸大小一样的图片，建立一个新的空白面板，写一小段代码将图片以“绝对位置”的方式覆盖原图即可。 ? ??? 但是这里存在个问题（谢谢 HYPERLINK /u/1052628434 \t _blank 寒山发现的问题并及时告知），以绝对位置方式覆盖时，不同的显示器分辨率会影响其位置，导致自己制作的banner严重横向错位，我尝试写一段JS代码用条件语句来确定不同显示分辨率下的图片位置，这时发现新浪不允许在空白面板和公告栏中使用JS（比较郁闷！），搜索了一下，知道可以使用“框架”引用已经上传的含有JS的html文件。问题也就迎刃而解。下面是具体代码和步骤。1、?测量并确定自己主页面上的banner的尺寸，不同的主页风格有不同大小的banner（我的页面是“朴素”类型，我用Photoshop测量banner的尺寸，大小是764X102）； ? 2、?按上述尺寸制作自己的个性banner图片； ? 3、?上传此图片，得到链接地址； ? 4、?打开“记事本”写入下面的代码： SCRIPTif(screen.width==800) {?document.write(body bgcolor=transparentIMG style=LEFT: 10px; POSITION: absolute; TOP: 55px height=102? src=图片链接地址 width=764 align=right useMap=#Map border=0 MAP name=MapAREA shape=RECT target=_blank coords=490,64,735,88 href=图片中热点文字链接的网页/MAP);}?if(screen.width==960) {?document.write(body bgcolor=transparentIMG style=LEFT: 90px; POSITION: absolute; TOP: 55px height=102? src=图片链接地址 width=764 align=right useMap=#Map border=0 MAP name=MapAREA shape=RECT target=_blank coords=490,64,735,88 href=图片中热点文字链接的网页/MAP);}?if(screen.width==1024) {?document.write(body bgcolor=transparentIMG style=LEFT: 122px; POSITION: absolute; TOP: 55px height=102? src=图片链接地址 width=764 align=right useMap=#Map border=0 MAP name=MapAREA shape=RECT target=_blank coords=490,64,735,88 href=图片中热点文字链接的网页/MAP);}?if(screen.width==1152) {?document.write(body bgcolor=transparentIMG style=LEFT: 186px; POSITION: absolute; TOP: 55px height=102? src=图片链接地址 width=764 align=right useMap=#Map border=0 MAP name=MapAREA shape=RECT target=_blank coords=490,64,735,88 href=图片中热点文字链接的网页/MAP);}?if(screen.width==1600) {?document.write(body bgcolor=transparentIMG style=LEFT: 410px; POSITION: absolute; TOP: 55px height=102? src=图片链接地址 width=764 align=right useMap=#Map border=0 MAP name=MapAREA shape=RECT target=_blank coords=490,64,735,88 href=图片中热点文字链接的网页/MAP);}/SCRIPT ? 注意：代码中的图片链接地址，为单引号引入的第三步中的图片链接地址。“coords=490,64,735,88”中的数值定义图片中热点文字的位置，做图时可以测绘得到； ? 5、?保存此记事本文件为html格式，例如“myjs.html”，上传此网页文件，