当前位置:首页 » 淘宝装修教程 » 正文

淘宝店铺装修代码,你会几种呢?

990 人参与  2018年08月07日 11:18  分类 : 淘宝装修教程  评论

淘宝店铺装修代码,你会几种呢?

下面就来说一些常用的代码,值得大家一看,高手请跳过,新手继续向下看

20180807.JPEG

一、 插入图片代码:

<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]='&lt;a href=#; img src=img/logo1.gif; border=0;'

slideimages[1]='&lt;a href=#; img src=img/logo2.gif; border=0;'

slideimages[2]='&lt;a href=#; img src=img/logo3.gif; border=0;'

slideimages[3]='&lt;a href=#; img src=img/logo4.gif; border=0;'

slideimages[4]='&lt;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}


来源:飞蚂蚁模板网(QQ号:254206549),转载请保留出处和链接!

本文链接:http://www.feimayi.net/zxjc/1053.html

加入【淘宝店铺装修】QQ群:474687967(加群验证:飞蚂蚁模板网)

淘宝天猫内部优惠券九元九特卖网一般人,我不告诉他喔!

<< 上一篇 下一篇 >>

  • 评论(1)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。
350装修模板
连衣裙
淘宝快递单号

淘宝商城

淘宝店铺装修教程 | 淘宝装修 | 淘宝装修免费模板 | 淘宝装修素材 | 淘宝店铺装修 | 网站地图 | VIP免费电影| 给我留言

Copyright(c)2013-2016feimayi.net All Rights Reserved. 粤ICP备14055454号
淘宝店铺装修交流群群号:474687967