♦

发俩个符合标准到下拉菜单

2006年08月10日  
  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4. <title>css菜单演示</title>
  5.  
  6.  
  7. <style type="text/css">
  8. <!--
  9.  
  10. *{margin:0;padding:0;border:0;}
  11. body {
  12. font-family: arial, 宋体, serif;
  13.         font-size:12px;
  14. }
  15.  
  16.  
  17. #nav {
  18.   line-height: 24px;  list-style-type: none; background:#666;
  19. }
  20.  
  21. #nav a {
  22. display: block; width: 80px; text-align:center;
  23. }
  24.  
  25. #nav a:link  {
  26. color:#666; text-decoration:none;
  27. }
  28. #nav a:visited  {
  29. color:#666;text-decoration:none;
  30. }
  31. #nav a:hover  {
  32. color:#FFF;text-decoration:none;font-weight:bold;
  33. }
  34.  
  35. #nav li {
  36. float: left; width: 80px; background:#CCC;
  37. }
  38. #nav li a:hover{
  39. background:#999;
  40. }
  41. #nav li ul {
  42. line-height: 27px;  list-style-type: none;text-align:left;
  43. left: -999em; width: 180px; position: absolute;
  44. }
  45. #nav li ul li{
  46. float: left; width: 180px;
  47. background: #F6F6F6;
  48. }
  49.  
  50.  
  51. #nav li ul a{
  52. display: block; width: 180px;w\idth: 156px;text-align:left;padding-left:24px;
  53. }
  54.  
  55. #nav li ul a:link  {
  56. color:#666; text-decoration:none;
  57. }
  58. #nav li ul a:visited  {
  59. color:#666;text-decoration:none;
  60. }
  61. #nav li ul a:hover  {
  62. color:#F3F3F3;text-decoration:none;font-weight:normal;
  63. background:#C00;
  64. }
  65.  
  66. #nav li:hover ul {
  67. left: auto;
  68. }
  69. #nav li.sfhover ul {
  70. left: auto;
  71. }
  72. #content {
  73. clear: left;
  74. }
  75.  
  76.  
  77. -->
  78. </style>
  79.  
  80. <script type=text/javascript><!--//--><![CDATA[//><!--
  81. function menuFix() {
  82. var sfEls = document.getElementById("nav").getElementsByTagName("li");
  83. for (var i=0; i<sfEls.length; i++) {
  84.   sfEls[i].onmouseover=function() {
  85.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  86.   }
  87.   sfEls[i].onMouseDown=function() {
  88.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  89.   }
  90.   sfEls[i].onMouseUp=function() {
  91.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  92.   }
  93.   sfEls[i].onmouseout=function() {
  94.   this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"),
  95.  
  96. "");
  97.   }
  98. }
  99. }
  100. window.onload=menuFix;
  101.  
  102. //--><!]]></script>
  103.  
  104. </head>
  105. <body>
  106.  
  107.  
  108. <ul id="nav">
  109. <li><a href="#">产品介绍</a>
  110.  <ul>
  111.  <li><a href="#">产品一</a></li>
  112.  <li><a href="#">产品一</a></li>
  113.  <li><a href="#">产品一</a></li>
  114.  <li><a href="#">产品一</a></li>
  115.  <li><a href="#">产品一</a></li>
  116.  <li><a href="#">产品一</a></li>
  117.  </ul>
  118. </li>
  119. <li><a href="#">服务介绍</a>
  120.  <ul>
  121.  <li><a href="#">服务二</a></li>
  122.  <li><a href="#">服务二</a></li>
  123.  <li><a href="#">服务二</a></li>
  124.  <li><a href="#">服务二服务二</a></li>
  125.  <li><a href="#">服务二服务二服务二</a></li>
  126.  <li><a href="#">服务二</a></li>
  127.  </ul>
  128. </li>
  129. <li><a href="#">成功案例</a>
  130.  <ul>
  131.  <li><a href="#">案例三</a></li>
  132.  <li><a href="#">案例</a></li>
  133.  <li><a href="#">案例三案例三</a></li>
  134.  <li><a href="#">案例三案例三案例三</a></li>
  135.  </ul>
  136. </li>
  137. <li><a href="#">关于我们</a>
  138.  <ul>
  139.  <li><a href="#">我们四</a></li>
  140.  <li><a href="#">我们四</a></li>
  141.  <li><a href="#">我们四</a></li>
  142.  <li><a href="#">我们四111</a></li>
  143.  </ul>
  144. </li>
  145.  
  146. <li><a href="#">在线演示</a>
  147.  <ul>
  148.  <li><a href="#">演示</a></li>
  149.  <li><a href="#">演示</a></li>
  150.  <li><a href="#">演示</a></li>
  151.  <li><a href="#">演示演示演示</a></li>
  152.  <li><a href="#">演示演示演示</a></li>
  153.  <li><a href="#">演示演示</a></li>
  154.  <li><a href="#">演示演示演示</a></li>
  155.  <li><a href="#">演示演示演示演示演示</a></li>
  156.  </ul>
  157. </li>
  158. <li><a href="#">联系我们</a>
  159.  <ul>
  160.  <li><a href="#">联系联系联系联系联系</a></li>
  161.  <li><a href="#">联系联系联系</a></li>
  162.  <li><a href="#">联系</a></li>
  163.  <li><a href="#">联系联系</a></li>
  164.  <li><a href="#">联系联系</a></li>
  165.  <li><a href="#">联系联系联系</a></li>
  166.  <li><a href="#">联系联系联系</a></li>
  167.  </ul>
  168. </li>
  169.  
  170. </ul>
  171.  
  172. </body>
  173. </html>
  1. <html><head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  3. <title>css菜单演示</title>
  4.  
  5.  
  6. <style type="text/css">
  7. <!--
  8.  
  9. *{margin:0;padding:0;border:0;}
  10. body {
  11. font-family: arial, 宋体, serif;
  12.         font-size:12px;
  13. }
  14.  
  15.  
  16. #nav {
  17.   line-height: 24px;  list-style-type: none; background:#666;   width:80px;
  18. }
  19.  
  20. #nav a {
  21. display: block; width: 80px; text-align:center;
  22. }
  23.  
  24. #nav a:link  {
  25. color:#666; text-decoration:none;
  26. }
  27. #nav a:visited  {
  28. color:#666;text-decoration:none;
  29. }
  30. #nav a:hover  {
  31. color:#FFF;text-decoration:none;font-weight:bold;
  32. }
  33.  
  34. #nav li {
  35. /*float: left*/; width: 80px; background:#CCC;
  36. }
  37. #nav li a:hover{
  38. background:#999;
  39. }
  40. #nav li ul {
  41. line-height: 27px;  list-style-type: none;text-align:left;
  42. left: -999em; width: 180px; position: absolute;
  43. }
  44. #nav li ul li{
  45. float: left; width: 180px;
  46. background: #F6F6F6;
  47. }
  48.  
  49.  
  50. #nav li ul a{
  51. display: block; width: 180px;w\idth: 156px;text-align:left;padding-left:24px;
  52. }
  53.  
  54. #nav li ul a:link  {
  55. color:#666; text-decoration:none;
  56. }
  57. #nav li ul a:visited  {
  58. color:#666;text-decoration:none;
  59. }
  60. #nav li ul a:hover  {
  61. color:#F3F3F3;text-decoration:none;font-weight:normal;
  62. background:#C00;
  63. }
  64.  
  65. #nav li:hover ul {
  66. left: auto;
  67. }
  68. #nav li.sfhover ul {
  69. left: auto;
  70. }
  71. #nav li.sfhover a {
  72. float:left;
  73. }
  74. #content {
  75. clear: left;
  76. }
  77.  
  78.  
  79. -->
  80. </style>
  81.  
  82. <script type=text/javascript><!--//--><![CDATA[//><!--
  83. function menuFix() {
  84. var sfEls = document.getElementById("nav").getElementsByTagName("li");
  85. for (var i=0; i<sfEls.length; i++) {
  86.   sfEls[i].onmouseover=function() {
  87.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  88.   }
  89.   sfEls[i].onMouseDown=function() {
  90.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  91.   }
  92.   sfEls[i].onMouseUp=function() {
  93.   this.className+=(this.className.length>0? " ": "") + "sfhover";
  94.   }
  95.   sfEls[i].onmouseout=function() {
  96.   this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"),
  97.  
  98. "");
  99.   }
  100. }
  101. }
  102. window.onload=menuFix;
  103.  
  104. //--><!]]></script>
  105.  
  106. </head>
  107. <body>
  108.  
  109.  
  110. <ul id="nav">
  111. <li><a href="#">产品介绍</a>
  112.  <ul>
  113.  <li><a href="#">产品一</a></li>
  114.  <li><a href="#">产品一</a></li>
  115.  <li><a href="#">产品一</a></li>
  116.  <li><a href="#">产品一</a></li>
  117.  <li><a href="#">产品一</a></li>
  118.  <li><a href="#">产品一</a></li>
  119.  </ul>
  120. </li>
  121. <li><a href="#">服务介绍</a>
  122.  <ul>
  123.  <li><a href="#">服务二</a></li>
  124.  <li><a href="#">服务二</a></li>
  125.  <li><a href="#">服务二</a></li>
  126.  <li><a href="#">服务二服务二</a></li>
  127.  <li><a href="#">服务二服务二服务二</a></li>
  128.  <li><a href="#">服务二</a></li>
  129.  </ul>
  130. </li>
  131. <li><a href="#">成功案例</a>
  132.  <ul>
  133.  <li><a href="#">案例三</a></li>
  134.  <li><a href="#">案例</a></li>
  135.  <li><a href="#">案例三案例三</a></li>
  136.  <li><a href="#">案例三案例三案例三</a></li>
  137.  </ul>
  138. </li>
  139. <li><a href="#">关于我们</a>
  140.  <ul>
  141.  <li><a href="#">我们四</a></li>
  142.  <li><a href="#">我们四</a></li>
  143.  <li><a href="#">我们四</a></li>
  144.  <li><a href="#">我们四111</a></li>
  145.  </ul>
  146. </li>
  147.  
  148. <li><a href="#">在线演示</a>
  149.  <ul>
  150.  <li><a href="#">演示</a></li>
  151.  <li><a href="#">演示</a></li>
  152.  <li><a href="#">演示</a></li>
  153.  <li><a href="#">演示演示演示</a></li>
  154.  <li><a href="#">演示演示演示</a></li>
  155.  <li><a href="#">演示演示</a></li>
  156.  <li><a href="#">演示演示演示</a></li>
  157.  <li><a href="#">演示演示演示演示演示</a></li>
  158.  </ul>
  159. </li>
  160. <li><a href="#">联系我们</a>
  161.  <ul>
  162.  <li><a href="#">联系联系联系联系联系</a></li>
  163.  <li><a href="#">联系联系联系</a></li>
  164.  <li><a href="#">联系</a></li>
  165.  <li><a href="#">联系联系</a></li>
  166.  <li><a href="#">联系联系</a></li>
  167.  <li><a href="#">联系联系联系</a></li>
  168.  <li><a href="#">联系联系联系</a></li>
  169.  </ul>
  170. </li>
  171.  
  172. </ul>
  173.  
  174. </body>
  175. </html>

0个评论  标签: ,   

一个很Cool的JS菜单效果

2006年08月10日  

http://bbs.blueidea.com/viewthread.php?tid=1491981

0个评论  标签:   

CSS 菜单举一反三

2006年08月09日  

http://www.blueidea.com/tech/site/2006/3658.asp

0个评论  标签:   

文章系统中“上篇、下篇”效果的制作

2006年07月31日  

以前曾经参考过一个网站的源码，是使用ID+1和ID-1的办法来判断上下篇的。在实际使用过程中，发现一个问题：当删除数据库中的一篇文章时，就会造成ID不连续，如果用ID+1和ID-1来判断就会出现找不到记录。所以程序并不是非常的完美。
　　在我们所介绍的ASP代码中，是通过查询大于当前ID的第一条记录来找出下一篇的ID，查询小于当前ID的第一条记录来找出上一篇的ID，这样就算ID不连续也可以正常显示了。（程序代码也是参阅过经典论坛相关贴子提示所制作的）
查看全文 »

0个评论  标签:   

个人对ASP中的split的简单理解。

2006年07月31日  

大家有没有碰到过要想取一字符串里的某些值而无从下手？有没有觉得看书或教材对split的写法糊里糊涂……如果有此疑问的话，请看下面我对例子的解释，相信您会对这个有一定的了解。
例如我想取得一个ftp里的用户名及密码（服务器等）值（用IE当FTP时或从表中取出FTP的值）。
下面是我的解决思路：
设url为收到的URL值，这里指：

  1. url=ftp://username:password@server，

请注意这句话的规律
我想大家都看清楚这个URL里的规律了吧，就是各个部分都被”:”给区分成三个部分，即：ftp、//username、password@server
首先将这个URL的各个部分区分开来，用split(url, “:”)
以下是具体的代码：

  1. parts = split(url, ":") '此时parts就有三部分，parts(0)=ftp，parts(1)=//username，parts(2)=password@server'接下来剔除没有用到的信息'由于只取username，所以其中parts(0)跟parts(2)是无用的，直接不引用！newname=replace(parts(1), "//", "") '去除//符号，因为这不是username里的内容'此时的newname既为用户名。

以上是只取用户名的代码，如果你要再取密码的话，可以参考下面。

由于用户名是属于parts(2)里的，而且包含服务器的信息，如果不取服务器，则：newpass = left(parts(2), instr(parts(2),”@”)-1) ‘取值到@之前的位数。此时的newpass取为密码

以上代码为不取服务器地址的代码，如果有取服务器的话，其实也是很简单的

  1. newparts=split(parts(2),"@") '此时newparts分成两部分：newparts(0)为密码，即password；newparts(1)则为服务器地址，即server'如果要输出密码的的话，直接response.write newparts(0)就可以了，服务器就newparts(1)

后话，对于要取一字符串中的某些字符或部分，只要抓住规律，再加上用split就可以很好做成各种效果。写此文，希望对大家的学习有所帮助，同时也希望大家能够指点一二！

无觅相关文章插件，快速提升流量

0个评论  标签:   

« 上一页下一页 »

这里都有我

分类

标签云

导向 rss 总结 逻辑 1haideas 公开课 闲谈 outlook 标准 乐趣分享 php 分享 八卦 jumpui 1sight 猪八戒 seo ucd 字体 xhtml 安全 产品背后 google 用户心理 美剧 gtd 2013 rp themes life

最新文章