注册 | 登陆

您的位置：阿里西西 > 网页特效 > 页面特效 > 详细内容

0顶

左侧纵向选项卡效果

稿源：互联网 2022-06-26 11:12:13 点击： 3060 撤稿纠错

位于左侧的纵向选项卡，想要漂亮点，自己修改样式吧。

以下讨论的是和相关的左侧纵向选项卡效果教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<style>
td,a,body{font-size:9pt;}
.DivAround_focus{cursor:pointer;background-color:#A1ACDB;border-right:solid 1px #A1ACDB;border-bottom:solid 1px #333333; border-left:solid 1px #C8CEEA;  border-top:solid 1px #C8CEEA;color:#000000}
.DivAround_blur{cursor:pointer;background:#4D5C9F;border-right:solid 1px #eeeeee;border-bottom:solid 1px #333333; border-left:solid 1px #798ACC;  border-top:solid 1px #A1ACDB;color:#FFFFFF}
.DivAround_content{background-color:#A1ACDB;border-right:solid 1px #888888;border-bottom:solid 1px #555555; border-left:0px; border-top:solid 1px #C8CEEA;}
body{FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=darkblue,endColorStr=skyblue);}
</style>
<script language="javascript">
var AroundInfoArray=new Array();
AroundInfoArray[0]="站长特效网,专注于网页特效及广告代码.
我们的网址是:<a href='http://www.zzjs.net'>www.zzjs.net</a>";
AroundInfoArray[1]="zzjs欢迎您，打造国内最帅的网页特效站，站长特效网。";
AroundInfoArray[2]="zz，站长，js，js特效，zzjs，站长特效，.com已泛滥，用.net打造靓站。";
function ChangeFocus(obj)
{//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
for(i=0;i<document.getElementById("leftButtonTAble").rows.length;i++)
{
 if(document.getElementById("leftButtonTAble").rows[i].cells[0]==obj)
 {
  document.getElementById("leftButtonTAble").rows[i].cells[0].className="DivAround_focus";
  document.getElementById("DivAroundContent").innerHTML=AroundInfoArray[i];
 }else{
  document.getElementById("leftButtonTAble").rows[i].cells[0].className="DivAround_blur";
 }
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
}
</script>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>

<table cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#6271B1"><tr><td width="84" valign="top">
   <table cellpadding="0" cellspacing="0" border="0" height="407" width="84" id="leftButtonTAble">
    <tr><td height="25" align="center" class="DivAround_focus" onClick="ChangeFocus(this)">站长特效网</td></tr>
    <tr><td height="25" align="center" class="DivAround_blur" onClick="ChangeFocus(this)">盗帅留香 </td></tr>
    <tr><td height="25" align="center" class="DivAround_blur" onClick="ChangeFocus(this)">寒流来袭</td></tr>
    <tr><td style="border-right:solid 1px #eeeeee"> </td></tr>
   </table>
  </td><td width="360">
   <table cellpadding="0" cellspacing="0" border="0" width="100%" class="DivAround_content">
    <tr><td height="406" valign="top" style="padding:4px" id="DivAroundContent">内容</td></tr>
   </table>
  </td></tr>
  </table>
  <script language="javascript">ChangeFocus(document.getElementById("leftButtonTAble").rows[0].cells[0]);</script>

关于左侧纵向选项卡效果的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2016322862600.shtml方便下次再访问哦。

·上一篇： 右侧纵向选项卡效果
·下一篇： 企业网站导航菜单

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »