iframe自适应高度

<iframe name="RightFrame" id="RightFrame" onload="this.height=this.contentWindow.document.documentElement.scrollHeight+20" src="email_emailContent.do?readEmailFileName=<s:property value="emlFilePath"/>" marginwidth="0" marginheight="0" frameborder="0" width="100%"></iframe>

JS定时器使用

<html>
    <head>
        <script language="javascript">
            function showtime() {
                var time = new Date();
                var hour = time.getHours();
                var minute = time.getMinutes();
                var seconds = time.getSeconds();
                document.getElementById("show").value=hour+ ":" + minute + ":" + seconds;
                var time = setTimeout("showtime()",1000);
            }
            function aa() {
                setTimeout("showtime()",1000);
            }
        </script>
        <style type="text/css">
            Input {
                border-style:none}
        </style>
    </head>
    <body onload="showtime()">
        <form>
            <Input id=’show’ type=’text’>
        </form>
    </body>
</html>

CSS和JS标签style属性对照表

CSS 和 JavaScript 标签 style 属性对照表:

盒子标签和属性对照
CSS语法(不区分大小写) JavaScript语法(区分大小写)
border border
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
border-bottom-width borderBottomWidth
border-color borderColor
border-left borderLeft
border-left-color borderLeftColor
border-left-style borderLeftStyle
border-left-width borderLeftWidth
border-right borderRight
border-right-color borderRightColor
border-right-style borderRightStyle
border-right-width borderRightWidth
border-style borderStyle
border-top borderTop
border-top-color borderTopColor
border-top-style borderTopStyle
border-top-width borderTopWidth
border-width borderWidth
clear clear
float floatStyle
margin margin
margin-bottom marginBottom
margin-left marginLeft
margin-right marginRight
margin-top marginTop
padding padding
padding-bottom paddingBottom
padding-left paddingLeft
padding-right paddingRight
padding-top paddingTop
颜色和背景标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
background background
background-attachment backgroundAttachment
background-color backgroundColor
background-image backgroundImage
background-position backgroundPosition
background-repeat backgroundRepeat
color color
样式标签和属性对照
CSS语法(不区分大小写) JavaScript 语法(区分大小写)
display display
list-style-type listStyleType
list-style-image listStyleImage
list-style-position listStylePosition
list-style listStyle
white-space whiteSpace
文字样式标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
font font
font-family fontFamily
font-size fontSize
font-style fontStyle
font-variant fontVariant
font-weight fontWeight
文本标签和属性对照
CSS 语法(不区分大小写) JavaScript 语法(区分大小写)
letter-spacing letterSpacing
line-break lineBreak
line-height lineHeight
text-align textAlign
text-decoration textDecoration
text-indent textIndent
text-justify textJustify
text-transform textTransform
vertical-align verticalAlign

日期选择框

var date_start,date_end,g_object
var today = new Date();
var separator="-";
var inover=false;

//mode :时间变换的类型0-年 1-月 2-直接选择月
function change_date(temp,mode)
{
var t_month,t_year
    if (mode){
        if(mode==1)
        t_month=parseInt(cele_date_month.value,10)+parseInt(temp,10);
        else
        t_month=parseInt(temp)
        if (t_month<cele_date_month.options(0).text) {
            cele_date_month.value=cele_date_month.options(cele_date_month.length-1).text;
            change_date(parseInt(cele_date_year.value,10)-1,0);
            }
        else{
            if (t_month>cele_date_month.options(cele_date_month.length-1).text){
                cele_date_month.value=cele_date_month.options(0).text;
                change_date(parseInt(cele_date_year.value,10)+1,0);
                }           
            else
                {cele_date_month.value=t_month;
                 set_cele_date(cele_date_year.value,cele_date_month.value);               
                }
        }
    }
    else{
        t_year=parseInt(temp,10);
       
        if (t_year<cele_date_year.options(0).text) {
            cele_date_year.value=cele_date_year.options(0).text;
            set_cele_date(cele_date_year.value,1);               
            }
        else{
            if (parseInt(t_year,10)>parseInt(cele_date_year.options(cele_date_year.length-1).text,10)){
                cele_date_year.value=cele_date_year.options(cele_date_year.length-1).text;
                set_cele_date(cele_date_year.value,12);               
                }           
            else
                {cele_date_year.value=t_year;
                 set_cele_date(cele_date_year.value,cele_date_month.value);               
                }
        }
    }
    /*********2002-02-01 MODIFY BY WING **************/
    window.cele_date.focus();
    /****************MODIFY END***********************/
}

//初始化日历
function init(d_start,d_end)
{
     var temp_str;
     var i=0
     var j=0
     date_start=new Date(1980,7,1)
     date_end=new Date(2004,8,1)
     document.writeln("<div name=\"cele_date\" id=\"cele_date\" style=\"display:none\"    style=\"LEFT: 69px; POSITION: absolute; TOP: 159px;Z-INDEX:99\" onClick=\"event.cancelBubble=true;\" onBlur=\"hilayer()\" onMouseout=\"lostlayerfocus()\">-</div>");
     window.cele_date.innerHTML="";
     temp_str="<table border=\"1\" bgcolor=\"#DDDDDD\" bordercolor=\"white\"><tr><td colspan=7 onmouseover=\"overcolor(this)\">";
     temp_str+="<input type=\"Button\" value=\"<<\" onclick=\"change_date(-1,1)\" onmouseover=\"getlayerfocus()\" style=\"color: #000099; background-color: #BFBFBF; cursor: hand\">-";

     temp_str+=""
     temp_str+="<select name=\"cele_date_year\" id=\"cele_date_year\" language=\"javascript\" onchange=\"change_date(this.value,0)\" onmouseover=\"getlayerfocus()\" onblur=\"getlayerfocus()\" style=\"font-size: 9pt; border: 1px #666666 outset; background-color: #F4F8FB\">"

     for (i=1900;i<=2020;i++)
     {
      temp_str+="<OPTION value=\""+i.toString()+"\">"+i.toString()+"</OPTION>";
     }
     temp_str+="</select>-";
     temp_str+=""
     temp_str+="<select name=\"cele_date_month\" id=\"cele_date_month\" language=\"javascript\" onchange=\"change_date(this.value,2)\" onmouseover=\"getlayerfocus()\" onblur=\"getlayerfocus()\" style=\"font-size: 9pt; border: 1px #666666 outset; background-color: #F4F8FB\">"

     for (i=1;i<=12;i++)
     {
      temp_str+="<OPTION value=\""+i.toString()+"\">"+i.toString()+"</OPTION>";
     }
     temp_str+="</select>-";
     temp_str+=""
     temp_str+="<input type=\"Button\" value=\">>\" onclick=\"change_date(1,1)\" onmouseover=\"getlayerfocus()\" style=\"color: #000099; background-color: #BFBFBF; cursor: hand\">";

     temp_str+="</td></tr><tr><td onmouseover=\"overcolor(this)\">"
     temp_str+="<font color=red>日</font></td><td>";
     temp_str+="一</td><td>";
     temp_str+="二</td><td>";
     temp_str+="三</td><td>";
     temp_str+="四</td><td>";
     temp_str+="五</td><td>";
     temp_str+="六</td></tr>";
     for (i=1 ;i<=6 ;i++)
     {
     temp_str+="<tr>";
        for(j=1;j<=7;j++){
            temp_str+="<td name=\"c"+i+"_"+j+"\"id=\"c"+i+"_"+j+"\" style=\"CURSOR: hand\" style=\"COLOR:#000000\" language=\"javascript\" onmouseover=\"overcolor(this)\" onmouseout=\"outcolor(this)\" onclick=\"td_click(this)\">?</td>"
            }
     temp_str+="</tr>"       
     }
     temp_str+="</td></tr></table>";
     window.cele_date.innerHTML=temp_str;
}
function set_cele_date(year,month)
{
   var i,j,p,k
   var nd=new Date(year,month-1,1);
   event.cancelBubble=true;
   cele_date_year.value=year;
   cele_date_month.value=month;  
   k=nd.getDay()-1
   var temp;
   for (i=1;i<=6;i++)
      for(j=1;j<=7;j++)
      {
      eval("c"+i+"_"+j+".innerHTML=\"\"");
      eval("c"+i+"_"+j+".bgColor=\"#DDDDDD\"");
      eval("c"+i+"_"+j+".style.cursor=\"hand\"");
      }
   while(month-1==nd.getMonth())
    { j=(nd.getDay() +1);
      p=parseInt((nd.getDate()+k) / 7)+1;
      eval("c"+p+"_"+j+".innerHTML="+"\""+nd.getDate()+"\"");
      if ((nd.getDate()==today.getDate())&&(cele_date_month.value==today.getMonth()+1)&&(cele_date_year.value==today.getYear())){
        eval("c"+p+"_"+j+".bgColor=\"#EFFB64\"");
      }
      if (nd>date_end || nd<date_start)
      {
      eval("c"+p+"_"+j+".bgColor=\"#FF9999\"");
      eval("c"+p+"_"+j+".style.cursor=\"text\"");
      }
      nd=new Date(nd.valueOf() + 86400000)
    }
}

//s_object:点击的对象;d_start-d_end有效的时间区段;需要存放值的控件;
function show_cele_date(eP,d_start,d_end,t_object,flag)
{
window.cele_date.style.display="";
window.cele_date.style.zIndex=99
var s,cur_d
var eT = eP.offsetTop;
var eH = eP.offsetHeight+eT;
var dH = window.cele_date.style.pixelHeight;
var sT = document.body.scrollTop;
var sL = document.body.scrollLeft;
event.cancelBubble=true;
if(flag==0){
window.cele_date.style.posLeft = 320
window.cele_date.style.posTop = 185;
}else if(flag==1){
window.cele_date.style.posLeft = 320
window.cele_date.style.posTop = 215;
}else if(flag==2){
window.cele_date.style.posLeft = 360
window.cele_date.style.posTop = 150;
}else if(flag==3){
window.cele_date.style.posLeft = 360
window.cele_date.style.posTop =178;
}

if (window.cele_date.style.posLeft+window.cele_date.clientWidth>document.body.clientWidth) window.cele_date.style.posLeft+=eP.offsetWidth-window.cele_date.clientWidth;
if (d_start!=""){
    if (d_start=="today"){
        date_start=new Date(today.getYear(),today.getMonth(),today.getDate());
    }else{
        s=d_start.split(separator);
        date_start=new Date(s[0],s[1]-1,s[2]);
    }
}else{
    date_start=new Date(1900,1,1);
}

if (d_end!=""){
    s=d_end.split(separator);
    date_end=new Date(s[0],s[1]-1,s[2]);
}else{
    date_end=new Date(3000,1,1);
}

g_object=t_object

cur_d=new Date()
set_cele_date(cur_d.getYear(),cur_d.getMonth()+1);
window.cele_date.style.display="block";

window.cele_date.focus();

}

function td_click(t_object)
{
var t_d
if (parseInt(t_object.innerHTML,10)>=1 && parseInt(t_object.innerHTML,10)<=31 )
{ t_d=new Date(cele_date_year.value,cele_date_month.value-1,t_object.innerHTML)
if (t_d<=date_end && t_d>=date_start)
{
var year = cele_date_year.value;
var month = cele_date_month.value;
var day = t_object.innerHTML;
var d = new Date();
if (parseInt(month)<10) month = "0" + month;
if (parseInt(day)<10) day = "0" + day;

//可以修改这里改变输出样式:
//g_object.value=year+"年"+month+"月"+day+"日";
var myDate = new Date();
var myhours=myDate.getHours()-1;       //获取当前小时数(0-23)
var myminutes=myDate.getMinutes();     //获取当前分钟数(0-59)
var myseconds=myDate.getSeconds();     //获取当前秒数(0-59)
//var mytime=myDate.toLocaleTimeString();     //获取当前时间
//alert(mytime);
//if(myhours<10){myhours=’0’+myhours};
if(myminutes<10){myminutes=’0’+myminutes};
if(myseconds<10){myseconds=’0’+myseconds};
g_object.value=year+separator+month+separator+day+" "+myhours+":"+myminutes+":"+myseconds;
window.cele_date.style.display="none";};
}

}
function h_cele_date()
{
window.cele_date.style.display="none";
}

function overcolor(obj)
{
if (obj.style.cursor=="hand") obj.style.color = "#FF0000";

inover=true;
window.cele_date.focus();

}

function outcolor(obj)
{
obj.style.color = "#000000";
inover=false;

}

function getNow(o){
    var Stamp=new Date();
    var year = Stamp.getYear();
    var month = Stamp.getMonth()+1;
    var day = Stamp.getDate();
    if(month<10){
month="0"+month;
    }
    if(day<10){
day="0"+day;
    }
    o.value=year+separator+month+separator+day;
}

function hilayer()
{
if (inover==false)
{
var lay=document.all.cele_date;
lay.style.display="none";
}
}
function getlayerfocus()
{
inover=true;
}
function lostlayerfocus()
{
inover=false;
}
init();
//日历结束
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

仿前程无忧图片滚动

a.html

<DIV class="mainleft s_search search_btm0">
<TABLE border=0 align=center>
<TBODY>
<TR>
    <TD vAlign=center><IMG style="CURSOR: pointer"
      onmouseover=clearInterval(MyMar)
      onmouseout=MyMar=setInterval(Marqueetoleft,speed)
      onclick=MarqueetoleftFast()
      src="【杭州,c招聘,求职】-前程无忧_files/search_slide_left.gif" width=14 height=38
      valign="absmiddle"></TD>
    <TD>
      <DIV style="WIDTH: 936px; HEIGHT: 70px; COLOR: #ffffff; OVERFLOW: hidden"
      id=demo>
      <TABLE border=0 cellPadding=0 align=left cellspace="0">
        <TBODY>
        <TR>
          <TD id=demo1 vAlign=top>
            <TABLE border=0 cellSpacing=0 cellPadding=4>
              <TBODY>
              <TR>
                <TD><A onfocus=blur() title=广州市海珠区湘计立德培训中心
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11355373"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/xiangji1207_7949b.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=深圳华育网科技发展有限公司
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11355086"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/huayu1215_7322.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=51Testing软件测试培训
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11351042"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/bowf0724_7399.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=上海华育信息管理职业技术培训学校
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11336117"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/huayu1119_7601.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=上海于达信息技术有限公司
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11349745"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/cskj1009_8488.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=北京尚观科技有限公司
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11331528"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/shangguan1020_7894.gif" width=150
                  height=60></A></TD>
                <TD><A onfocus=blur() title=大成模具设计学校
                  href="
http://ac.51job.com/phpAD/adtrace.php?ID=11329950"
                  target=_blank><IMG style="CURSOR: pointer"
                  onmouseover=clearInterval(MyMar)
                  onmouseout=MyMar=setInterval(Marqueetoleft,speed) border=0
                  src="【杭州,c招聘,求职】-前程无忧_files/dacheng1120_7098.gif" width=150
                  height=60></A></TD></TR></TBODY></TABLE></TD>
          <TD id=demo2 vAlign=top></TD></TR></TBODY></TABLE></DIV></TD>
    <TD><IMG style="CURSOR: pointer" onmouseover=clearInterval(MyMar)
      onmouseout=MyMar=setInterval(Marqueetoleft,speed)
      onclick=MarqueetorightFast()
      src="【杭州,c招聘,求职】-前程无忧_files/search_slide_right.gif" width=14
height=38></TD></TR></TBODY></TABLE>
<SCRIPT src="【杭州,c招聘,求职】-前程无忧_files/marquee.js"></SCRIPT>
</DIV>

marquee.js

var speed = 16; //速度数值越大速度越慢

document.getElementById(‘demo2′).innerHTML = document.getElementById(‘demo1′).innerHTML;
document.getElementById(‘demo2′).scrollLeft = document.getElementById(‘demo2′).scrollWidth;
function Marqueetoleft() {
if ((document.getElementById(‘demo2′).offsetWidth – document.getElementById(‘demo’).scrollLeft) <= 0) {
    document.getElementById(‘demo’).scrollLeft -= document.getElementById(‘demo1′).offsetWidth;
} else {
    document.getElementById(‘demo’).scrollLeft += 1;
}
}

function MarqueetoleftFast() {
if((document.getElementById(‘demo2′).offsetWidth – document.getElementById(‘demo’).scrollLeft) < (document.getElementById(‘demo’).offsetWidth+12)){
   document.getElementById(‘demo’).scrollLeft = document.getElementById(‘demo’).scrollLeft + document.getElementById(‘demo’).offsetWidth+12 – document.getElementById(‘demo1′).offsetWidth;
} else {
   //alert(document.getElementById(‘demo’).offsetWidth);
document.getElementById(‘demo’).scrollLeft += document.getElementById(‘demo’).offsetWidth+12;
}
}

function Marqueetoright() {
if (document.getElementById(‘demo’).scrollLeft <= 0) {
    document.getElementById(‘demo’).scrollLeft += document.getElementById(‘demo1′).offsetWidth;
} else {
document.getElementById(‘demo’).scrollLeft–;
}
}

function MarqueetorightFast() {
if(document.getElementById(‘demo’).scrollLeft <= document.getElementById(‘demo’).offsetWidth+12){
   document.getElementById(‘demo’).scrollLeft = document.getElementById(‘demo’).scrollLeft – (document.getElementById(‘demo’).offsetWidth+12) + document.getElementById(‘demo1′).offsetWidth;
} else {
document.getElementById(‘demo’).scrollLeft -= document.getElementById(‘demo’).offsetWidth+12;
}
}
MyMar = setInterval(Marqueetoleft, speed);

漂亮的等待页面导航

本特效共分3步:
1.在<head></head>中加入:
<STYLE type=text/css>TD {
FONT-SIZE: 9pt
}
.come {
BACKGROUND-COLOR: #eff7d4; BORDER-BOTTOM: #c07a0b 1px dashed; BORDER-LEFT: #c07a0b 1px dashed; BORDER-RIGHT: #c07a0b 1px dashed; BORDER-TOP: #c07a0b 1px dashed; COLOR: #000000; FONT-SIZE: 9pt; HEIGHT: 18px
}
</style>
<SCRIPT language=javascript>
var percent = new Number(0);
function skipmain() {
    dopgb();
}
function dopgb() {
    var pgb = document.all.pgbdiv.style;
    var timeoutID = setTimeout("dopgb()",100);
    if (pgb.pixelWidth < 230) pgb.pixelWidth += 5;
    percent = parseInt(100 * (pgb.pixelWidth / 230) + 1) + 1;
    if (percent > 100) percent = 100;
    document.all.perdiv.innerHTML="<p align=’center’ style=’margin-top:0;margin-bottom:0′>" + percent.toString(10) + " %</p>"
    if (pgb.pixelWidth >= 230) {
      clearTimeout(timeoutID);
      window.navigate("
http://www.okajax.com/");
      return;
    }
}
</SCRIPT>

2.将 onload=skipmain() 插入到<body>中

例如:<body onload=skipmain()>

3.在<body></body>中间加入:
      <TABLE align=center border=1 borderColor=#000000 cellPadding=0       
      cellSpacing=0 height=10       
      style="BORDER-COLLAPSE: collapse; MARGIN: 10px 0px 0px" width=230       
      name="pgb_container1">      
        <TBODY>      
        <TR>      
          <TD class=newfont3>      
            <DIV id=pgbdiv       
            style="BACKGROUND-COLOR: #65a1ca; HEIGHT: 10px; MARGIN: 0px; TEXT-ALIGN: center; WIDTH: 0px"       
            border="0"></DIV></TD></TR></TBODY></TABLE>      
      <P align=center style="MARGIN-TOP: 5px">      
      <DIV align=center id=perdiv style="MARGIN-BOTTOM: 0px; MARGIN-TOP: 0px">      
      <P align=center class=newfont3       
      style="MARGIN-BOTTOM: 0px; MARGIN-TOP: 0px">0 %</P></DIV>          
    
      <P align=center style="MARGIN: 10px"><INPUT align=center class=come onclick="window.navigate(‘http://www.okajax.com/’)" style="cursor: hand; width: 140; height: 22" title=我不想等了,直接进入 type=button value=直接进入2259音乐空间>        
      </P>

实现自定义鼠标右键(2)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>鼠标右键更换</title>
<!– CSS样式设定 –>
<style type="text/css">
<!–
.cMenu {
position: absolute;
visibility:hidden;
color:#000000;
width:150px;
border:2px dashed #999999;
background-color:#f0f0f0;
font-size:9pt;
line-height:18px;
cursor:default;
filter: Alpha(Opacity=80);
}

.menuitems {
padding-left:15px;
padding-right:10px;
}
–>
</style>
<!– JS脚本 –>
<SCRIPT LANGUAGE="JavaScript">
// RightClickMenu

function showmenuie5(){
var rightedge=document.body.clientWidth-event.clientX
var bottomedge=document.body.clientHeight-event.clientY
if (rightedge<ie5menu.offsetWidth)
   ie5menu.style.left=document.body.scrollLeft+event.clientX-ie5menu.offsetWidth
else
   ie5menu.style.left=document.body.scrollLeft+event.clientX
if (bottomedge<ie5menu.offsetHeight)
   ie5menu.style.top=document.body.scrollTop+event.clientY-ie5menu.offsetHeight
else
   ie5menu.style.top=document.body.scrollTop+event.clientY
ie5menu.style.visibility="visible"
return false
}
function hidemenuie5(){
ie5menu.style.visibility="hidden"
}
function highlightie5(){
if (event.srcElement.className=="menuitems"){
   event.srcElement.style.backgroundColor="highlight"
   event.srcElement.style.color="white"
}
}
function lowlightie5(){
if (event.srcElement.className=="menuitems"){
   event.srcElement.style.backgroundColor=""
   event.srcElement.style.color="black"
}
}
function jumptoie5(){
if (event.srcElement.className=="menuitems"){
   if (event.srcElement.url != ”){
    if (event.srcElement.getAttribute("target")!=null)
     window.open(event.srcElement.url,event.srcElement.getAttribute("target"))
    else
     window.location=event.srcElement.url
   }
}
}

</SCRIPT>
</head>
<body>
<!– 鼠标右键更换内容,更换下面相对应名称和链接即可。 –>
<RightClick>
<!–[if IE]>
<div id="ie5menu" class="cMenu" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5()">
<div class="menuitems" url="
http://www.cnrui.cn/blog">我的BLOG</div>
<HR>
<div class="menuitems" url="
http://www.ryanxia.com" target="_blank">RYAN空间</div>
<div class="menuitems" url="
http://www.awflasher.com" target="_blank">AWflash</div>
<div class="menuitems" url="
http://www.a-fei.net" target="_blank">ONLYMAKE</div>
<div class="menuitems" url="
http://www.rystudio.com" target="_blank">锐意工作室</div>
<HR>
<div class="menuitems" url="
http://www.cnrui.cn/blog/tools.asp" target="_blank">在线工具</div>
<div class="menuitems" url="
http://www.cnrui.cn/blog/pplive.asp" target="_blank">在线电视</div>
<HR>
<div class="menuitems" url="
http://www.cnrui.cn/live/index.html" target="_blank">BTLIVE</div>
<div class="menuitems" url="
http://www.ao-w.com/" target="_blank">奥网科技</div>
<div class="menuitems" url="
http://www.synacast.com/" target="_blank">上海聚力传媒</div>
<HR>
<div class="menuitems" url="
http://www.cnrui.cn/blog/gbook.asp" target="_blank">给我留言</div>
<![endif]–>
<script language="JavaScript">
<!–
if (document.all&&window.print){
ie5menu.className="cMenu"
document.oncontextmenu=showmenuie5
document.body.onclick=hidemenuie5
}
//–>
</script>
</RightClick>
<!– 鼠标右键更换内容完毕 –>
</body>
</html>

实现自定义鼠标右键

<!–
注释
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
–>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>自定义鼠标右键</title>

<script language="javascript" type="text/javascript">
document.oncontextmenu = function ()
{
    var div = document.getElementById("hdiv");
   
    div.style.pixelLeft = event.clientX;
    div.style.pixelTop = event.clientY;
   
    div.style.display = "block";
   
    return false;
}
</script>
</head>

<body>

<div id="hdiv" align="center" style="position:absolute; display:none; background-color:#EFF8FF; height:300px; width:100px; top:0px; left:0px; ">

<fieldset style="border-color:#96C2EF; border-width:1px; border-style:solid;">
<legend>潍科</legend>

<table width="100%" bgcolor="#ECE9D8" style="cursor:pointer;">

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >关闭菜单</td>
</tr>

<tr><td><hr size="0" color="#C0C0C0" noshade="noshade"></td></tr>

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >首 题</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >上一题</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’">下一题</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >末 题</td>
</tr>

<tr><td><hr size="0" color="#C0C0C0" noshade="noshade"></td></tr>

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >标记此题</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >取消标记</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >答题状态</td>
</tr>

<tr><td><hr size="0" color="#C0C0C0" noshade="noshade"></td></tr>

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >全 部</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >单 选</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >多 选</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >填 空</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >判 断</td>
</tr>

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >其 它</td>
</tr>

<tr><td><hr size="0" color="#C0C0C0" noshade="noshade"></td></tr>

<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >保存</td>
</tr>
<tr onMouseOver="this.bgColor=’FFFFFF’" onMouseOut="this.bgColor=’#ECE9D8’">
<td align="center" onClick="hdiv.style.display=’none’" >交卷</td>
</tr>

</table>
</fieldset>
</div>

</body>

</html>

最经典的自动+鼠标控制图片滚动

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>超级经典一套鼠标控制左右滚动图片带自动翻滚</title>
</head>
<body>
<div class="rollBox">
     <div class="LeftBotton" onmousedown="ISL_GoUp()" onmouseup="ISL_StopUp()" onmouseout="ISL_StopUp()"></div>
     <div class="Cont" id="ISL_Cont">
      <div class="ScrCont">
       <div id="List1">
       
        <!– 图片列表 begin –>
         <div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/15.html" target="_blank"><img src="http://i0.sinaimg.cn/edu/deco/2007/0928/aiying.jpg" width="109" height="87" alt="周宪环" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/15.html" target="_blank">周宪环</a>
         </div>       
        
<div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/16.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/zhenwei.jpg" width="109" height="87" alt="周桢炜" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/16.html" target="_blank">周桢炜</a>
         </div>
         <div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/14.html" target="_blank"><img src="http://i2.sinaimg.cn/edu/deco/2007/0928/zhangying.jpg" width="109" height="87" alt="张颖" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/14.html" target="_blank">张颖</a>
         </div>
         <div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/17.html" target="_blank"><img src="http://i3.sinaimg.cn/edu/deco/2007/0928/wangnaichao.jpg" width="109" height="87" alt="王乃超" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/17.html" target="_blank">王乃超</a>
         </div>
         <div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/19.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/xiewenxiu.jpg" width="109" height="87" alt="谢雯琇" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/19.html" target="_blank">谢雯琇</a>
         </div>
<div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0928/18.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/lvge.jpg" width="109" height="87" alt="吕铬" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0928/18.html" target="_blank">吕铬</a>
         </div>      
         <div class="pic">
          <a href="
http://career.sina.com.cn/3/2007/0927/12.html" target="_blank"><img src="http://i2.sinaimg.cn/edu/deco/2007/0928/zhengru.jpg" width="109" height="87" alt="贾正如" /></a>
          <a href="
http://career.sina.com.cn/3/2007/0927/12.html" target="_blank">贾正如</a>
         </div>
        <!– 图片列表 end –>
        
       </div>
       <div id="List2"></div>
      </div>
     </div>
     <div class="RightBotton" onmousedown="ISL_GoDown()" onmouseup="ISL_StopDown()" onmouseout="ISL_StopDown()"></div>
    </div>
   </div>
<style type="text/css">
<!–
.rollBox{width:704px;overflow:hidden;padding:12px 0 5px 6px;}
.rollBox .LeftBotton{height:52px;width:19px;background:url(
http://i3.sinaimg.cn/edu/deco/2007/0924/career/job_mj_069.gif) no-repeat 11px 0;overflow:hidden;float:left;display:inline;margin:25px 0 0 0;cursor:pointer;}
.rollBox .RightBotton{height:52px;width:20px;background:url(
http://i3.sinaimg.cn/edu/deco/2007/0924/career/job_mj_069.gif) no-repeat -8px 0;overflow:hidden;float:left;display:inline;margin:25px 0 0 0;cursor:pointer;}
.rollBox .Cont{width:663px;overflow:hidden;float:left;}
.rollBox .ScrCont{width:10000000px;}
.rollBox .Cont .pic{width:132px;float:left;text-align:center;}
.rollBox .Cont .pic img{padding:4px;background:#fff;border:1px solid #ccc;display:block;margin:0 auto;}
.rollBox .Cont .pic p{line-height:26px;color:#505050;}
.rollBox .Cont a:link,.rollBox .Cont a:visited{color:#626466;text-decoration:none;}
.rollBox .Cont a:hover{color:#f00;text-decoration:underline;}
.rollBox #List1,.rollBox #List2{float:left;}
–>
</style>
<script language="javascript" type="text/javascript">
<!–//–><![CDATA[//><!–
//图片滚动列表 mengjia 070816
var Speed = 10; //速度(毫秒)
var Space = 5; //每次移动(px)
var PageWidth = 132; //翻页宽度
var fill = 0; //整体移位
var MoveLock = false;
var MoveTimeObj;
var Comp = 0;
var AutoPlayObj = null;
GetObj("List2").innerHTML = GetObj("List1").innerHTML;
GetObj(‘ISL_Cont’).scrollLeft = fill;
GetObj("ISL_Cont").onmouseover = function(){clearInterval(AutoPlayObj);}
GetObj("ISL_Cont").onmouseout = function(){AutoPlay();}
AutoPlay();
function GetObj(objName){if(document.getElementById){return eval(‘document.getElementById("’+objName+’")’)}else{return eval(‘document.all.’+objName)}}
function AutoPlay(){ //自动滚动
clearInterval(AutoPlayObj);
AutoPlayObj = setInterval(‘ISL_GoDown();ISL_StopDown();’,1000); //间隔时间
}
function ISL_GoUp(){ //上翻开始
if(MoveLock) return;
clearInterval(AutoPlayObj);
MoveLock = true;
MoveTimeObj = setInterval(‘ISL_ScrUp();’,Speed);
}
function ISL_StopUp(){ //上翻停止
clearInterval(MoveTimeObj);
if(GetObj(‘ISL_Cont’).scrollLeft % PageWidth – fill != 0){
Comp = fill – (GetObj(‘ISL_Cont’).scrollLeft % PageWidth);
CompScr();
}else{
MoveLock = false;
}
AutoPlay();
}
function ISL_ScrUp(){ //上翻动作
if(GetObj(‘ISL_Cont’).scrollLeft <= 0){GetObj(‘ISL_Cont’).scrollLeft = GetObj(‘ISL_Cont’).scrollLeft + GetObj(‘List1′).offsetWidth}
GetObj(‘ISL_Cont’).scrollLeft -= Space ;
}
function ISL_GoDown(){ //下翻
clearInterval(MoveTimeObj);
if(MoveLock) return;
clearInterval(AutoPlayObj);
MoveLock = true;
ISL_ScrDown();
MoveTimeObj = setInterval(‘ISL_ScrDown()’,Speed);
}
function ISL_StopDown(){ //下翻停止
clearInterval(MoveTimeObj);
if(GetObj(‘ISL_Cont’).scrollLeft % PageWidth – fill != 0 ){
Comp = PageWidth – GetObj(‘ISL_Cont’).scrollLeft % PageWidth + fill;
CompScr();
}else{
MoveLock = false;
}
AutoPlay();
}
function ISL_ScrDown(){ //下翻动作
if(GetObj(‘ISL_Cont’).scrollLeft >= GetObj(‘List1′).scrollWidth){GetObj(‘ISL_Cont’).scrollLeft = GetObj(‘ISL_Cont’).scrollLeft – GetObj(‘List1′).scrollWidth;}
GetObj(‘ISL_Cont’).scrollLeft += Space ;
}
function CompScr(){
var num;
if(Comp == 0){MoveLock = false;return;}
if(Comp < 0){ //上翻
if(Comp < -Space){
   Comp += Space;
   num = Space;
}else{
   num = -Comp;
   Comp = 0;
}
GetObj(‘ISL_Cont’).scrollLeft -= num;
setTimeout(‘CompScr()’,Speed);
}else{ //下翻
if(Comp > Space){
   Comp -= Space;
   num = Space;
}else{
   num = Comp;
   Comp = 0;
}
GetObj(‘ISL_Cont’).scrollLeft += num;
setTimeout(‘CompScr()’,Speed);
}
}
//–><!]]>
</script>
</body>
</html>

仿百度JAVASCRIPT弹出层登陆及验证效果,

仿百度JAVASCRIPT弹出层登陆及验证效果,

原JAVASCRIPT弹出层代码作者为葫芦居士:http://www.gourdboy.com/blogView.asp?aid=384

我加入了登陆及验证效果!如图

转载帮做链接:秦皇岛女性网HTTP://WWW.QHDLADY.COM 谢了!

有问题回帖。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="
http://www.w3.org/1999/xhtml">

<head>

<title></title>

<meta http-equiv="Content-type" content="text/html; charset=gb2312" />

<meta name="keywords" content="," />

<meta name="content:encoded" content="此页面的说明" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

</head>

<body>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<input type="button" value="显示" onclick="loadBox.show()"/>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p><p>页面</p>

<p>页面</p>

<p>页面</p>

<p>页面</p>

<p>1</p>

<style type="text/css">

body,p,div,ul,ol{padding:0;margin:0;border:0;}

body{height:100%;font-size:12px;}

.bgLayer{ background:#000; opacity:0.5; filter:alpha(opacity=50);z-index:10001;position:absolute;left:0;top:0;}

.boxLayer{ background:#fff; border:4px solid #ccc; overflow:hidden; zoom:1; z-index:10002; position:absolute;padding:8px;}

.boxLayer p{padding:5px 0;text-align:center;}

.alldenglu{

    width:260px;}

.denglu {

font-size: 14px;

margin-bottom:6px;

color: #999999;

}

</style>

<script type="text/javascript">

//<![CDATA[

//弹出层 by ChenLiang v1.0

function LightBox(boxWidth,boxHeight,boxContent)

{

this.boxWidth=boxWidth;

this.boxHeight=boxHeight;

this.boxContent=boxContent;

var bgLayer,boxLayer;

var documentHtml=document.documentElement;

this.createBgLayer=function()

{

bgLayer = document.createElement("div");

with (bgLayer)

{

className="bgLayer";

style.width=documentHtml.scrollWidth+"px";

style.height=documentHtml.scrollHeight+"px";

style.display="none";

}

document.body.insertBefore(bgLayer,document.body.firstChild);

};

this.createBox=function(){

boxLayer = document.createElement("div");

with (boxLayer)

{

className = "boxLayer";

style.width=this.boxWidth + "px";

style.height = this.boxHeight +"px";

style.display="none";

};

document.body.insertBefore(boxLayer,document.body.firstChild);

};

this.init= function()

{

this.createBgLayer();

this.createBox();

}

// if IE 6.0

function hideShowSelect(obj)

{

if (window.navigator.userAgent.indexOf("MSIE 6.0") > 0)

{

var selectDom = document.getElementsByTagName("select");

for (var i = 0; i < selectDom.length ; i++)

{

if (obj)

selectDom[i].style.display="none";

else

selectDom[i].style.display="";

}

}

};

this.show = function()

{

hideShowSelect(true);

boxLayer.innerHTML=this.boxContent;

bgLayer.style.display = "block";

boxLayer.style.display = "block";

boxLayer.style.left = documentHtml.offsetWidth /2 – boxLayer.offsetWidth/2 +"px";

boxLayer.style.top = documentHtml.scrollTop + documentHtml.clientHeight/2 – this.boxHeight/2 -30 + "px";

}

this.hide = function()

{

hideShowSelect(false);

bgLayer.style.display = "none";

boxLayer.style.display = "none";

}

}

//]]>

</script>

<script>

function checkEmail (str) {

//alert(str);

isEmail1=/^\w+([\.\-]\w+)*\@\w+([\.\-]\w+)*\.\w+$/;

isEmail2=/^.*@[^_]*$/;

//alert(isEmail1.test(str)&&isEmail2.test(str));

return (isEmail1.test(str)&&isEmail2.test(str));

}

function IsDigit(cCheck)     

{     

return ((‘0′<=cCheck) && (cCheck<=’9′));     

}     

     

function IsAlpha(cCheck)     

{     

return (((‘a'<=cCheck) && (cCheck<=’z’)) || ((‘A'<=cCheck) && (cCheck<=’Z’)))     

}              

      

function IsaNull(cCheck)          

{          

return(cCheck != " ")         

}        



function checkform(){

//alert(document.indexForm.username.value);

if (document.indexForm.username.value == ""){     

    alert("请输入注册名");     

    document.indexForm.username.focus();     

    return false;     

   }

  

   if(document.indexForm.username.value.length>20 || document.indexForm.username.value.length<6){

    alert("用户名为6到12个字母或数字");

    document.indexForm.username.focus();

    return false;

   }

  

   for (nIndex=0; nIndex<document.indexForm.username.value.length; nIndex++){

cCheck = document.indexForm.username.value.charAt(nIndex);     

    if (!(IsDigit(cCheck) || IsAlpha(cCheck) || cCheck==’-‘ || cCheck==’_’ || cCheck==’.’)){     

      alert("用户名只能使用字母、数字以及-、_和.,并且不能使用中文");     

      document.indexForm.username.focus();     

      return false;     

     }     

   }

   if (document.indexForm.password.value == ""){

    alert("请输入注册密码");     

    document.indexForm.password.focus();     

    return false;     

   }

   if(document.indexForm.password.value.length < 6 || document.indexForm.password.length >20){

    alert("密码长度在6–12位之间!");

    document.indexForm.password.focus();

    return false;

   }

  

document.indexForm.submit();

return true;  

}



</script>

<script type="text/javascript">

//调用方法

var loadBox= new LightBox(260,150);

window.onload=function(){

loadBox.init();

loadBox.boxContent='<div class="alldenglu"><form action="chenggong.htm" method="post" enctype="multipart/form-data" name="indexForm"><div class="wenji">玩游戏前,请先登陆!</div><div align="center" class="denglu">用户名:<input type="text" name="username" value="" size="15"></div><div align="center" class="denglu">密&nbsp;&nbsp;码:<input type="password" name="password" value="" size="15"></div><div align="center" class="denglu"><input type="submit" name="button" id="button" value="提交" onclick="return checkform()" />&nbsp;<input name="" type="reset" value="重置" /><input type="button" value="不想玩了!" onclick="loadBox.hide()" /></div></form></div>';

}

</script>

</body></html>