凸显个性网页右键菜单我作主

来源：Linuxdby.com 作者：Webmaster 时间：2007-06-05 点击： [收藏] [投稿]

<HTML><HEAD><TITLE>右键菜单的淡入淡出效果</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<SCRIPT language=JavaScript>
<!-- // RightClickMenu
var intDelay=10; //设置菜单显示速度，越大越慢
var intInterval=5; //每次更改的透明度
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"
        //ie5menu.style.visibility=""
        ie5menu.filters.alpha.opacity=0
        GradientShow()
        return false
}
function hidemenuie5(){
        //ie5menu.style.visibility="hidden"
        GradientClose()
}
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="#000000"
        }
} 
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
            }
        }
}

function GradientShow() //实现淡入的函数 
{ 
    ie5menu.filters.alpha.opacity+=intInterval 
    if (ie5menu.filters.alpha.opacity<100) setTimeout("GradientShow()",intDelay)
} 
    
function GradientClose() //实现淡出的函数 
    { 
    ie5menu.filters.alpha.opacity-=intInterval 
    if (ie5menu.filters.alpha.opacity>0) { 
     setTimeout("GradientClose()",intDelay) 
     } 
    else { 
     ie5menu.style.visibility="hidden"
     } 
}

function ChangeBG() //改变菜单项的背景颜色，这里的两种颜色值可以改为你需要的 
{ 
    oEl=event.srcElement 
    if (oEl.style.background!="navy") { 
        oEl.style.background="navy" 
    } 
    else { 
        oEl.style.background="#cccccc" 
    } 
} 
// -->
</SCRIPT>

<STYLE type=text/css>
.cMenu {
    FILTER: alpha(opacity=0);BACKGROUND-COLOR: #D6D3CE;BORDER-BOTTOM: #666666 2px solid; BORDER-LEFT: #E4E4E4 2px solid; BORDER-RIGHT: #666666 2px solid; BORDER-TOP: #E4E4E4 2px solid; COLOR: #000000; CURSOR: default; FONT-SIZE: 9pt; color:#000000;FONT-WEIGHT: normal; LINE-HEIGHT: 20px; POSITION: absolute; VISIBILITY: hidden; WIDTH: 110px
}
.menuitems {
    font-size:9pt;
    MARGIN: 2px;
    PADDING-BOTTOM: 0px;
PADDING-LEFT: 15px;
PADDING-RIGHT: 3px;
PADDING-TOP: 0px;
}
</STYLE>

<DIV class=menuitems url="javascript:click_obj(0)">后退</DIV>
<DIV class=menuitems url="javascript:click_obj(1)">前进</DIV>
<DIV class=menuhr><hr style="width:100%"></DIV>
<DIV class=menuitems url="javascript:click_obj(2)">刷新</DIV>
<DIV class=menuitems url="javascript:click_obj(3)">加入收藏夹</DIV>
<DIV class=menuitems url="javascript:click_obj(4)">查看源文件</DIV>
<DIV class=menuhr><hr style="width:100%"></DIV>
<DIV class=menuitems url="javascript:click_obj(5)">属性</DIV>

</DIV>
<![endif]-->

<SCRIPT language=JavaScript>
<!--
function click_obj(id){
    switch(id){
        case 0:    
            history.back()
            break
        case 1:
            history.forward()
            break
        case 2:
            window.location.reload()
            break
        case 3:
            window.external.AddFavorite(location.href, document.title)
            break
        case 4:
            window.location = "view-source:" + window.location.href
            break
        case 5:
            document.all.WebBrowser.ExecWB(10,1)
            break
    }
}

if (document.all&&window.print){
    ie5menu.className="cMenu"
    document.oncontextmenu=showmenuie5
    document.body.onclick=hidemenuie5
}
//-->
</SCRIPT>
</RIGHTCLICK>
</BODY></HTML>

<br />
              
              <br />
            <center>  
            <strong>  <font color="#0000FF">如果您对本文有任何疑问或者建议，请到讨论区发表您的意见:</font> 
            </strong><a href="http://bbs.linux-cn.com" target="_blank"><strong><font color="#FF0000">>> 
            论坛入口 <<</font></strong></a> <br>
            <br>
            <div class="articlepages"><a href='#'>上一页</a><strong>1</strong><a href='52833_2.html'>2</a> <a href='52833_2.html'>下一页</a> </div>

</center><br /><br />

上一篇：<a href='/html/website/html/20070605/52832.html'>玩转表格 让你的网页炫起来</a>    下一篇：<a href='/html/website/html/20070605/52834.html'>优化网站的20条重要体会</a> 
<br /><br />
<center>
【<a href="/plus/feedback.php?arcID=52833" title="文章评论" target="_blank">文章评论</a>】 
            【<a href="javascript:window.external.addFavorite('http://www.linux-cn.com/plus/view.php?aid=52833','凸显个性 网页右键菜单我作主|Linux中国')" title="收藏本文" target="_blank">收藏本文</a>】 
            【<a href="/plus/recommend.php?arcID=52833" title="推荐好友" target="_blank">推荐好友</a>】 
            【<a href="javascript:window.print();" title="打印本文" target="_self">打印本文</a>】 
            【<a href="/member/article_add.php" target="_blank">我要投稿</a>】 【<a href="http://bbs.linux-cn.com" target="_blank">论坛讨论</a>】</center>
              
              </div>
        </div> 
        
        <div class="articleadtop728"><script src='/plus/ad_js.php?aid=23' language='javascript'></script></div>
              <div class="title">更多相关文章</div>
			
                	<div class="relativearticle">·<a href='/html/website/html/20070605/52878.html'>浅议Web网页Form表单设计技巧</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52877.html'>超级实用的几种表单校验效果收集</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52876.html'>揭开正则表达式的神秘面纱</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52875.html'>教你制作GBK与Unicode的对照表</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52874.html'>常用网页播放器代码</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52873.html'>要速度更要灵活，JFCMS系统功能评测</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52872.html'>渐飞CMS普及风暴活动公告</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52871.html'>SSI技术—SHTML（生成静态时用的最火）</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52870.html'>Google官方讲解NOINDEX、NOFOLLOW、NOARCHIVE及N</a></div><div class="relativearticle">·<a href='/html/website/html/20070605/52869.html'>一个form两个提交按钮,分别提交到两页面</a></div>
             
		  </div>
          
    
    </td>
    <td class="channelright">
    <div class="rightad250_250">
    <script src='/plus/ad_js.php?aid=19' language='javascript'></script>
    </div>
    <div class="suggestarticles">
         <div class="title">推荐文章</div>
         <div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52818.html'>robots.txt和Robots META标签</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7052.html'> HTML教程-HTML入门</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7454.html'> HTML 初学者指南(五)</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7668.html'> HTML 基本语法</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7593.html'> ADO存取数据库怎么样与HTML结合</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52846.html'>正则表达式过滤HTML危险脚本 </a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52864.html'>HTML：网页刷新方法集合</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52795.html'>10分钟架设Blog实践</a></div>
      </div>
      
       <div class="rightad250_300">
       <script src='/plus/ad_js.php?aid=20' language='javascript'></script>
       </div>
       
       <div class="randsuggest">
          <div class="title">精彩文章</div>
           <div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52787.html'>震惊 任意修改大网站在Alexa说明教</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7469.html'> HTML组件(HTML COMPONENTS)之</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52825.html'>初学网站制作须知道什么是静态网页</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7587.html'> 网页设计中Html使用中的一些问题</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7361.html'> HTML基础知识</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7471.html'> HTML组件(HTML COMPONENTS)之</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7459.html'> HTML 初学者指南(十)</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52878.html'>浅议Web网页Form表单设计技巧</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7629.html'> HTML和CSS编写漂亮正规的网页代码</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7050.html'> HTML教程-Frame 的其它属性</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7049.html'> HTML教程-各窗口间相互操作(Frame&</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7616.html'> 怎么为Html的Select加提示语</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52819.html'>页面的强制换行问题总结</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52854.html'>rel=nofollow互联网为超链接戴上安</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7048.html'> HTML教程-各窗口的尺寸设置</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7617.html'> HTML语法详细介绍</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7051.html'> HTML教程-总复习</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7551.html'> Html的几个小技巧</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52774.html'>巧用SnagIt复制加密网页文字</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7594.html'> 利用VB提取HTML文件中的EMAIL地址</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52844.html'>如何隐藏网页中的层DIV</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7047.html'> HTML教程-多窗口页面(Frames)</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7670.html'> HTML教程-标题</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070605/52777.html'>Google的网站收录和排名</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7592.html'> 怎么样用ASP把一大段文字中的HTML</a></div><div class="suggestarticlestitle">·<a href='/html/website/html/20070412/7565.html'> Html保持用户状态的多种方法比较</a></div>
       </div>
       
       
    </td>
 </tr>
 </table>
<div class="bottomnav bigwidthwithborder">
<script type="text/javascript" language="javascript" src="/linuxcn/js/bottomnav.js"></script>
</div>
<div class="bottomcopyright bigwidth">
<a href='http://www.linux-cn.com' target='_blank'>Power by linux-cn.com</a> <a href="http://www.miibeian.gov.cn" target="_blank">粤ICP备05006655号</a> <script language="javascript" type="text/javascript" src="/linuxcn/js/allbottom.js"></script>
</div>
</body>
</html>

凸显个性 网页右键菜单我作主

凸显个性网页右键菜单我作主