日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 综合教程 >内容正文

综合教程

JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)_javascript技巧

發布時間:2023/12/19 综合教程 32 生活家
生活随笔 收集整理的這篇文章主要介紹了 JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)_javascript技巧 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

本文實例講述了JS實現常見的TAB、彈出層效果。分享給大家供大家參考。具體如下:

這里演示tab活頁夾(網頁標簽),斑馬線,遮罩層、彈出層的簡單實現,里面的JS文件,可下拉保存為JS代碼調用即可,也可以拷貝在本網頁中使用。這個小網頁囊括了目前網上流行的風頁標簽、彈出層以及斑馬線效果,很實用啦。

運行效果截圖如下:

在線演示地址如下:

http://demo.jb51.net/js/2015/js-tab-alert-bq-style-demo/

具體代碼如下:





tab活頁夾,斑馬線,遮罩層)的簡單實現

* {margin:0;padding:0;list-style:none;font-size:12px;line-height:20px;font-family:Arial;}
h1,h2,h3 { font-size:14px; margin:10px 0;}
hr { margin:10px 0; height:1px;clear:both;border:0; background:#c00;}
a:link,a:visited{color:#164A84;text-decoration:none;}
a:hover,a:active{color:#c00;text-decoration:underline;}
table { border-collapse:collapse;border:1px solid #ccc;border-width:1px 1px 0 0; margin-left:20px;}
td,th { padding:5px;border:1px solid #ccc;border-width:0 0 1px 1px;}



.barry1 {background:#f5f5f5;} .barry0 {background:#fff;} .hover {background:#ddd;}

2:斑馬線

廠商指導價經銷商報價促銷信息報價時間
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
19.08萬19.18萬 慶賀奇瑞北京突破10萬輛全系大酬賓2008-12-15
.ul { margin:20px 0 0 20px;width:300px;border:1px solid #ccc;border-bottom:0;} .ul li { height:20px; padding:3px 5px;border-bottom:1px solid #ccc;}
  • [企業] 每條最多19個字
  • [代碼] 第一屆世界智力運動成式成
  • [企業] 上海通用汽車鼎持全球俱樂部山
  • [特效] 推動和諧發展 打造綠色企業
  • [企業] 發現商業智慧 見證進步思想
  • [編程] 成就汽車維修“金藍領”夢想
  • [源碼] 發現商業智慧 見證進步思想
  • [風格] 成就汽車維修“金藍領”夢想
  • [程序] 發現商業智慧 見證進步思想
  • [行業] 成就汽車維修“金藍領”夢想

.pop { border:3px solid skyblue;width:400px; background:#fff; padding:5px; display:none;}

3:遮罩層

點擊彈出 點擊關閉

登錄后復制

希望本文所述對大家的JavaScript程序設計有所幫助。

總結

以上是生活随笔為你收集整理的JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)_javascript技巧的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。