可多次使用的仿126邮箱选项卡的源码

选项卡我们这论坛里有不少,但同一个页面可以多次使用的可能没多少,我这个可以在同一个页面里可以有多个选项卡块.用了一个背景图.

背景图片已上传上去了,支持我的帮顶一下,俺昨天花费几个小时啊.
终于适应Ie,ff 浏览器.现在所有代码公开给大家.希望大家喜欢.要用的赶紧拿去用吧.

类似于下面效果.

screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.style.cursor='hand'; this.alt='Click here to open new window\nCTRL+Mouse wheel to zoom in/out';}" onclick="if(!this.resized) {return true;} else {window.open(this.src);}" alt="" src="http://zsrimg.ikafan.com/upload/20071003220847714.gif" onload="if(this.width>screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.alt='Click here to open new window\nCTRL+Mouse wheel to zoom in/out';}" border=0>

再加一个div块时只要
<div id="Tab2">
<div class="Menubox">
<ul>
   <li id="two1" onclick="setTab('two',1,4)" >新闻1</li>
   <li id="two2" onclick="setTab('two',2,4)" >新闻2</li>
   <li id="two3" onclick="setTab('two',3,4)">新闻3</li>   
   <li id="two4" onclick="setTab('two',4,4)">新闻4</li>
</ul>
</div>
<div class="Contentbox">  
   <div id="con_two_1" >新闻列表1</div>
   <div id="con_two_2" style="display:none">新闻列表2</div>
   <div id="con_two_3" style="display:none">新闻列表3</div>
   <div id="con_two_4" style="display:none">新闻列表4</div>
</div>
</div>

看到上面的two没有,把上面的这段复制下,把two改成three,或任何一个不同名的id,就完成了.

简洁Tab

  • 新闻1
  • 新闻2
  • 新闻3
  • 新闻4

新闻列表1

新闻列表2

新闻列表3

新闻列表4

  • 新闻1
  • 新闻2
  • 新闻3
  • 新闻4

新闻列表1

新闻列表2

新闻列表3

新闻列表4

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

忘记说了tab2也要改,改成tab3吧,同一个页面div,id总不能重复吧.

(0)

相关推荐

  • 可多次使用的仿126邮箱选项卡的源码

    选项卡我们这论坛里有不少,但同一个页面可以多次使用的可能没多少,我这个可以在同一个页面里可以有多个选项卡块.用了一个背景图. 背景图片已上传上去了,支持我的帮顶一下,俺昨天花费几个小时啊.终于适应Ie,ff 浏览器.现在所有代码公开给大家.希望大家喜欢.要用的赶紧拿去用吧.类似于下面效果. screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.style.cursor='hand'; this.alt='C

  • javascript仿126邮箱TAB切换效果

    简洁Tab 新闻1 新闻2 新闻3 新闻4 新闻列表1 新闻列表2 新闻列表3 新闻列表4 新闻1 新闻2 新闻3 新闻4 新闻列表1 新闻列表2 新闻列表3 新闻列表4 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • php 模拟GMAIL,HOTMAIL(MSN),YAHOO,163,126邮箱登录的详细介绍

    最近一直在忙,赶在这个假期结束的时候,发表一下此文,为了是让这些源码开源出来当然这些方法可能不可取,但大致应该是这种方向了吧,由于目前做的一个UCHOME港台的站点咱们策划说要改一下好友邀请里面的显示方式,开始我也没有在意,当时就说行!到了弄这个的时候才发现,UCH里面的这个地方是用漫游型式做的,让人很是无解,啥都改不了!唉,既然都答应了说可以,现在实际情况不行了,所以觉得不好意思,为了快速解决这问题,在GOOGLE,百度上搜了个遍,结果又出忽意料,就一个126邮箱的开源例子,其它的都没有,有一

  • elementui源码学习之仿写一个el-divider组件

    目录 正文 组件需求分析 组件中用到的知识点 函数式组件 函数式组件的两种定义方式 解决一像素太粗的问题 组件封装 组件封装的效果图 组件封装的代码 正文 本篇文章记录仿写一个el-divider组件细节,从而有助于大家更好理解饿了么ui对应组件具体工作细节.本文是elementui源码学习仿写系列的又一篇文章,后续空闲了会不断更新并仿写其他组件.源码在github上,大家可以拉下来,npm start运行跑起来,结合注释有助于更好的理解. github仓库地址如下:github.com/shu

  • elementui源码学习仿写el-link示例详解

    目录 正文 组件思考 组件的需求 组件的效果图 组件实现分析 给link组件加上链接样式 给link组件加上鼠标悬浮时下划线 通过传参控制是否加上下划线(即:是否加上这个下划线类名) 使用v-bind="$attrs"兜底a标签的其他的未在props中声明的参数 代码 使用代码 封装组件代码 正文 本篇文章记录仿写一个el-link组件细节,从而有助于大家更好理解饿了么ui对应组件具体工作细节.本文是elementui源码学习仿写系列的又一篇文章,后续空闲了会不断更新并仿写其他组件.源

  • bat批处理一键登录网易163和126邮箱

    相信很多朋友都有网易163或者是126的邮箱,如果你平时不怎么使用Foxmail这类邮件客户端工具来收发邮件,而是喜欢通过Web浏览器进行收发邮件,那么每次都要打开邮箱登录地址,然后输入用户名和密码,实在是麻烦.下面就介绍一种一键登录网易163和126邮箱的方法,打开并登录到163和126邮箱就像在桌面上用快捷方式打开应用程序那样简单. 一.一键登录网易163邮箱方法 将如下代码复制到记事本中,然后保存为.bat批处理文件,这里取名为:htmer_163mail.bat,保存后双击运行即可. 复

  • Python自动登录126邮箱的方法

    本文实例讲述了Python自动登录126邮箱的方法.分享给大家供大家参考.具体实现方法如下: import sys, urllib2, urllib,cookielib import re cookie = cookielib.LWPCookieJar() opener=urllib2.build_opener(urllib2.HTTPCookieProcessor(cookie)) urllib2.install_opener(opener) url='http://entry.mail.12

  • 基于JQuery实现仿网易邮箱全屏动感滚动插件fullPage

    先给大家展示效果图如下所示: 使用方法: 首先在head区引入jquery.js,jquery-ui.js,fullPage.js以及样式文件jquery.fullPage.css <link rel="stylesheet" href="css/jquery.fullPage.css"> <script src="js/jquery.min.js"></script> <script src="

  • python3+selenium实现126邮箱登陆并发送邮件功能

    本文实例为大家分享了python3实现126邮箱登陆并发送邮件的具体代码,供大家参考,具体内容如下 基于selenium,使用chrome浏览器,完成126邮箱登陆并发送发邮件功能,暂时未封装. from selenium import webdriver # 导入显示等待类 from selenium.webdriver.support.ui import WebDriverWait # 导入期望场景类 from selenium.webdriver.support import expect

  • python实现126邮箱发送邮件

    用Python发送126邮件,供大家参考,具体内容如下 今天想做个自动化邮件提醒的功能,最近刚好在学习python,都说python那么强大,想试一下python能否搞定,搜一下资料,果真可以,而且又简单通俗易懂 from email.mail.text import MIMEText import smtplib #发件人列表 to_list=["zhangsan@163.com", "lisi@qq.com"] #对于大型的邮件服务器,有反垃圾邮件的功能,必须登

随机推荐