淘宝店铺装修代码,你会几种呢?
下面就来说一些常用的代码,值得大家一看,高手请跳过,新手继续向下看
一、 插入图片代码:
<img src="图片链接地址" />
注:先把图片上传到网络相册网络地址(如果你没有网络相册可以申请一个),把它拷贝下来,放到下边一串代码里替代汉字部分;可以应用于公告栏、分类栏及宝贝描述内。
二、插入公告栏挂饰代码:
<img src="图片链接地址" style="left:20px; position: relative; top:0px" />
注:先把挂饰图片上传到网络相册;可以应用于公告栏、分类栏及宝贝描述内。
三、背景音乐代码:
< loop="-1" src="音乐地址"></ >
注:先把挂饰图片上传到网络相册;可以应用于公告栏、宝贝描述内。
三、在图片里附加音乐的办法:
<img border=0 src="图片地址" dynsrc=音乐地址>
四、浮动的图片的代码:
<img alt="1" height="150" src="这里放图片地址"/>
五、悬浮挂饰代码:
<img src="这里放图片地址" style="left:20px; position: relative; top:0px" />
六、文字链接代码:
<a href="网页地址">链接的文字</a>
七、移动文字代码:
<marquee>从右到左移动的文字</marquee>
八、计数器代码
<a href="http://00counter.com" target="_blank"><img src="计数器地址"border=0
alt="00Counter.com"></a>
九、店铺公告里的漂亮悬浮挂件的代码:
<marquee style="position:relative;" ="this.stop()" ="this.start()" scrollamount="1" scrolldelay="85" direction="up" behavior="scroll" height="60">
<img src="加入你自己的图片地址" />
十、店铺公告添加个性的鼠标指针代码:
<table style="CURSOR: url('上传后的鼠标指针的网址')"><tr><td>
<table border="0" style="TABLE-LAYOUT: fixed">
十一、宝贝描述加上个性的鼠标指针代码
先选“编辑源文件” ,然后复制以下代码:
<table width="100%" style="CURSOR: url('这里是已上传的鼠标指针网址')">
<tr>
<td width="100%">
另外,还要在源文件底部输入代码:</td></tr></table>
十二、添加QQ在线交谈代码:
<a target=blank href=http://wpa.qq.com/msgrd?V=1&Uin=41826029&Site=www.goodcup.bokee.com&Menu=yes>
<img border="0" SRC=http://wpa.qq.com/pa?p=1:41826029:7 alt="点击这里给我发消息"></a>
注: 这是QQ在线状态的代码,里面的数值要改变,号码和网址改为你自己的,这个链接的作用是别人可以直接点击联系你而无需加你为好友,使用方法是直接链接。
十三、下面的代码设置在一定区域内让文字向上滚:“scrollamount=”可改变速度。
<font size=3 color=ff0000><b><center><marquee width=150 height=100 direction=up
scrollamount=2>文字</marquee></font></b></center>
十四、添加旺旺在线代码:
<A href="wangwang:SendIM?yexiaoyewen&uid_t=yexiaoyewen"><IMG src=
"http://pics. /newstyle/online_pic.gif" border=0></A>
十五、插入-FLASH动画:
< src="http://cartoonfile.163.com/source/55095/mingzzd" width="400"height="290"></ >
十六、让文字左右来回流动:
<marquee behavior="alternate">88亮荘</marquee>
十七、让文字由下至上滚动:
<marquee direction="up">88亮荘</marquee>
十八、让文字由左向右流动:
<marquee direction="right">88亮荘</marquee>
十九、如何让文字滚动起来:
<marquee>88亮荘</marquee>
常用源代码
1.分时问候
<script language="JavaScript">
<!--
var mess1="";
document.write("<center><font color='#0000FF' size=4><b>")
day = new Date( )
hr = day.getHours( )
if (( hr >= 0 ) && (hr <= 4 ))
mess1="深夜了,注意身体,该休息了!"
if (( hr >= 4 ) && (hr < 7))
mess1="清晨好,这麽早就上网呀?! "
if (( hr >= 7 ) && (hr < 12))
mess1="早上好,一天之际在于晨,又是美好的一天!"
if (( hr >= 12) && (hr <= 13))
mess1="该吃午饭啦!有什麽好吃的?"
if (( hr >= 13) && (hr <= 17))
mess1="外面的天气很热吧?!心静自然凉! "
if (( hr >= 17) && (hr <= 18))
mess1="太阳落山了!快看看夕阳吧!"
if ((hr >= 18) && (hr <= 19))
mess1="吃过晚饭了吗?"
if ((hr >= 19) && (hr <= 23))
mess1="一天过的可真快!今天过的好吗?"
document.write(mess1)
document.write("</b></font></center>")
//--->
</script>
说明:将代码放至<body>…</body>之间,其中:
在0-4点间,出现“深夜了,注意身体,该休息了!”字样,依此类推。
2.图片淡入淡出
var b = 1;
var c = true;
function fade(){
if(document.all);
if(c == true) {
b++;
}
if(b==100) {
b--;
c = false
if(b==10) {
c = true;
if(c == false) {
child.filters.alpha.opacity=0 + b;
setTimeout("fade()",100);
<img src="img/1.jpg" name="child" border=0
alt="Image" style="filter:alpha(opacity=0)">
说明:将代码放至<body>…</body>之间要显示该图片的位置,其中:
<img src=img/1.jpg name=child style="filter:alpha(opacity=0) ">
表示插入一个文件名为“1.jpg”的图片,设置其透明度为0,根据插入的图片路径进行修改。
3.闪烁文字
<script language=javascript>
function initArray() {
this.length = initArray.arguments.length;
for (var i = 0; i < this.length; i++) {
this[i] = initArray.arguments[i];
var ctext = "看看我,我会变色";
var speed = 1000;
var x = 0;
var color = new initArray(
"red",
"blue",
"green",
"black",
"yellow",
"pink");
if (navigator.appVersion.indexOf("MSIE") != -1)
{
document.write('<div id="c"><center>'+ctext+'</center></div>');
function chcolor()
document.all.c.style.color = color[x];
(x < color.length-1) ? x++ : x = 0;
setInterval("chcolor()",1000);
-->
说明:将代码放至<body>…</body>之间要显示闪烁文字的位置,其中:
输入要显示的闪烁文字。
4.图形跟随鼠标
var newtop=0
var newleft=0
if (navigator.appVersion.indexOf("MSIE") != -1) {
layerStyleRef="layer.style.";
layerRef="document.all";
styleSwitch=".style";
function doMouseMove() {
layerName = 'iit'
eval('var curElement='+layerRef+'["'+layerName+'"]')
eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"')
eval('curElement'+styleSwitch+'.visibility="visible"')
eval('newleft=document.body.clientWidth-curElement'+styleSwitch+'.pixelWidth')
eval('newtop=document.body.clientHeight-curElement'+styleSwitch+'.pixelHeight')
eval('height=curElement'+styleSwitch+'.height')
eval('width=curElement'+styleSwitch+'.width')
width=parseInt(width)
height=parseInt(height)
if (event.clientX > (document.body.clientWidth - 5 - width))
newleft=document.body.clientWidth + document.body.scrollLeft - 5 - width
else
newleft=document.body.scrollLeft + event.clientX
eval('curElement'+styleSwitch+'.pixelLeft=newleft')
if (event.clientY > (document.body.clientHeight - 5 - height))
newtop=document.body.clientHeight + document.body.scrollTop - 5 - height
newtop=document.body.scrollTop + event.clientY
eval('curElement'+styleSwitch+'.pixelTop=newtop')
document.onmousemove = doMouseMove;
<script language="javascript">
document.write('<div ID=OuterDiv>')
document.write('<img ID=iit src="images/rabbit.gif" STYLE="position:absolute;TOP:0pt;LEFT:0pt;Z-INDEX:2;visibility:hidden;">')
document.write('</div>')
说明:将代码放至<body>…</body>之间,效果与动画鼠标类似,该代码是在鼠标指针旁边跟随一张图片,其中:
document.write('<img ID=iit src="images/rabbit.gif"
rabbit.gif为上传后的图形名称
5.滚动显示图片
<script language="JavaScript1.2">
var scrollerwidth=64
var Scrollerheight=64
var scrollerbgcolor='white'
var pausebetweenimages=3000
var slideimages=new Array()
slideimages[0]='<a href=#; img src=img/logo1.gif; border=0;'
slideimages[1]='<a href=#; img src=img/logo2.gif; border=0;'
slideimages[2]='<a href=#; img src=img/logo3.gif; border=0;'
slideimages[3]='<a href=#; img src=img/logo4.gif; border=0;'
slideimages[4]='<a href=#; img src=img/logo5.gif; border=0;'
if (slideimages.length>1)
i=2
i=0
function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("move1(tlayer)",pausebetweenimages)
setTimeout("move2(document.main.document.second)",pausebetweenimages)
return
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("move1(tlayer)",100)
else{
tlayer.top=scrollerheight
tlayer.document.write(slideimages[i])
tlayer.document.close()
if (i==slideimages.length-1)
i++
function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("move2(tlayer2)",pausebetweenimages)
setTimeout("move1(document.main.document.first)",pausebetweenimages)
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("move2(tlayer2)",100)
tlayer2.top=scrollerheight
tlayer2.document.write(slideimages[i])
tlayer2.document.close()
function move3(whichdiv){
tdiv=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){
tdiv.style.pixelTop=0
setTimeout("move3(tdiv)",pausebetweenimages)
setTimeout("move4(second2)",pausebetweenimages)
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){
tdiv.style.pixelTop-=5
setTimeout("move3(tdiv)",100)
tdiv.style.pixelTop=scrollerheight
tdiv.innerHTML=slideimages[i]
function move4(whichdiv){
tdiv2=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){
tdiv2.style.pixelTop=0
setTimeout("move4(tdiv2)",pausebetweenimages)
setTimeout("move3(first2)",pausebetweenimages)
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){
tdiv2.style.pixelTop-=5
setTimeout("move4(second2)",100)
tdiv2.style.pixelTop=scrollerheight
tdiv2.innerHTML=slideimages[i]
function startscroll(){
if (document.all){
move3(first2)
second2.style.top=scrollerheight
else if (document.layers){
move1(document.main.document.first)
document.main.document.second.top=scrollerheight+5
document.main.document.second.visibility='show'
window.onload=startscroll
//-->
<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; bgcolor=&{scrollerbgcolor};>
<layer id="first" left=0 top=1 width=&{scrollerwidth};>
if (document.layers)
document.write(slideimages[0])
</layer>
<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
document.write(slideimages[1])
</ilayer>
<p>
document.writeln('<span id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+'">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0;top:1;">')
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0;top:0">')
document.writeln('</span>')
说明:将代码放至<body>…</body>之间要滚动显示图片的位置,其中:
logo1.gif、logo2.gif、logo3.gif、logo4.gif、logo5.gif为滚动显示的5张图片。该滚动显示图片的效果与滚动字幕略有不同,每显示一张图片会略有停顿,方便浏览。
6.随机产生的图片
a = 3
var pp = Math.random();
var foot = Math.round(pp * (a-1))+1;
function create() {
this.src = ''
this.border = ''
this.alt = ''
b = new Array()
for(var i=1; i<=a; i++) { b[i] = new create() }
b[1].src = "img/4.jpg"
b[1].border = "0"
b[1].alt = ""
b[2].src = "img/2.jpg"
b[2].border = "0"
b[2].alt = ""
b[3].src = "img/3.jpg"
b[3].border = "0"
b[3].alt = ""
var pic = "";
pic += '<img src='+b[foot].src+' border="0"'+' alt='+b[foot].alt+'>';
document.write(pic)
说明:将代码放至<body>…</body>之间要显示图片的位置,每次刷新网页都会随机显示不同的图片,其中:2.jpg、3.jpg、4.jpg为该实例中显示的图片名称,请更换为你需要显示的图片名称。
导航代码
.skin-box-bd .menu-list{background: none repeat scroll 0 0 #00ad08;}
/*首页/店铺动态背景色*/
.skin-box-bd .menu-list .link{background: none repeat scroll 0 0 #FFFFFF;}
/*首页/店铺动态右边线*/
.skin-box-bd .menu-list .menu{border-right:1px #006205solid;}
/*首页/店铺动态文字颜色*/
.skin-box-bd .menu-list .menu .title{color: #9F5F9F}
/*所有分类背景色*/
.all-cats .link{background: none repeat scroll 0 0 #FF00FF;}
/*所有分类右边线*/
.all-cats .link{border-right:1px #8C7853 solid;}
/*所有分类文字颜色*/
.skin-box-bd .all-cats .title{color: #FFFF00}