`
zengbo0710
  • 浏览: 414824 次
社区版块
存档分类
最新评论

悬停显示不同内容

阅读更多

<!-- 省略 -->
<script type="text/javascript">
<!--//--><![CDATA[//><!--

function Show_Sub(id_num,num){
 for(var i=0;i<=9;i++){
  if(GetObj("T_Menu_"+id_num+i))GetObj("T_Menu_"+id_num+i).className="";
  if(GetObj("content_"+id_num+i))GetObj("content_"+id_num+i).style.display="none";
 }
 if(GetObj("T_Menu_"+id_num+num))GetObj("T_Menu_"+id_num+num).className="selectd";
 if(GetObj("content_"+id_num+num))GetObj("content_"+id_num+num).style.display="block";
}
function GetObj(objName){
 if(document.getElementById){
  return eval('document.getElementById("' + objName + '")');
 }else{
  return eval('document.all.' + objName);
 }
}
//--><!]]>
</script>

<!-- 省略 -->


   <div class="right">
    <div class="T_Menu">
     <ul>
      <li class="selectd" id="T_Menu_11" onmouseover="Show_Sub(1,1)">每日排行</li>
      <li id="T_Menu_12" onmouseover="Show_Sub(1,2)">热播排行</li>
     </ul>
    </div>
    <!-- 每日排行 -->
    <div class="content" id="content_11">
     <ul class="link-414141-yl">
      <li class="fff"><span class="td_1 top">1</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li><span class="td_1 top">2</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li class="fff"><span class="td_1 top">3</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li><span class="td_1">4</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li class="fff"><span class="td_1">5</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li><span class="td_1">6</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li class="fff"><span class="td_1">7</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li><span class="td_1">8</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li class="fff"><span class="td_1">9</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
      <li><span class="td_1">10</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场《跳大</a></span></li>
     </ul>
    </div>
    <!-- 热播排行 -->
    <div class="content" id="content_12" style="display:none">
     <ul class="link-414141-yl">
      <li class="fff"><span class="td_1 top">1</span><span class="td_2"><a href="url" target="_blank">郭德刚场</a></span></li>
      <li><span class="td_1 top">2</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li class="fff"><span class="td_1 top">3</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li><span class="td_1">4</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li class="fff"><span class="td_1">5</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li><span class="td_1">6</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li class="fff"><span class="td_1">7</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li><span class="td_1">8</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li class="fff"><span class="td_1">9</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
      <li><span class="td_1">10</span><span class="td_2"><a href="url" target="_blank">郭德刚相声专场</a></span></li>
     </ul>
    </div>
   </div>
   <div class="clearit"></div>
  </div>

 

分享到:
评论

相关推荐

    js悬停图片显示文字内容

    在网页设计中,"js悬停图片显示文字内容"是一种常见的交互效果,它能提升用户体验,使得用户在鼠标悬停在图片上时能看到与图片相关的附加信息。这种效果主要通过JavaScript实现,配合HTML和CSS来完成。下面我们将...

    鼠标悬停显示字符

    "鼠标悬停显示字符"这一功能通常用于提供快捷的上下文帮助,使用户能够快速了解控件的功能或相关数据。在本篇文章中,我们将深入探讨这个功能的实现原理、应用场景以及相关的编程技术。 首先,我们要理解鼠标悬停...

    Metro界面效果鼠标悬停显示文字.zip

    这种鼠标悬停显示文字的效果也应考虑到响应式设计,确保在不同设备(如桌面、平板、手机)上都能正确显示和交互。这可能涉及到媒体查询(media queries)和流式布局(flexible layout)的运用。 5. **JavaScript...

    html5气泡提示框鼠标悬停气泡文字框提示代码

    "气泡提示框"是其中一种常见的用户界面元素,主要用于提供额外的信息或提示,当鼠标悬停在某个元素上时,会显示一个包含信息的小窗口,这种效果在网页设计中广泛使用,以增强用户对网页元素的理解。 在HTML5中实现...

    jQuery悬停放大突出内容代码.zip

    【jQuery悬停放大突出内容代码】是一个用于网页交互设计的JavaScript特效,主要应用于图片展示,当用户将鼠标指针悬停在图片上时,图片会放大,并且在放大后的图片上叠加显示相关的内容详情。这种效果可以提升用户...

    chart游标跟随并悬停显示ToolTip

    在本话题中,我们关注的是"chart游标跟随并悬停显示ToolTip"的功能,这是一种增强图表交互性和用户体验的技术。在用户将鼠标指针悬停在图表的特定数据点上时,会弹出一个ToolTip,显示该点对应的数据信息,同时游标...

    jquery简单的鼠标悬停按钮显示浮动提示框效果代码

    当鼠标进入按钮时,调用`.show()`方法显示提示框;当鼠标离开时,调用`.hide()`方法隐藏提示框。 4. **CSS样式**:为了使提示框看起来更像浮动效果,可以为其添加CSS样式,如定位、背景色、边框等。 ```css #...

    jQuery鼠标悬停提示框美化代码.zip

    该压缩包包含的代码主要用于实现鼠标悬停时显示提示框的功能,并且提供了四种不同的样式:上边、左边、右边和下边。这些提示框可以在鼠标指针附近以各种方向显示信息,为用户提供更直观、更吸引人的视觉效果。提示框...

    jquery中国地图热点鼠标悬停显示地址文字提示内容.zip

    标题中的“jquery中国地图热点鼠标悬停显示地址文字提示内容.zip”表明这是一个使用jQuery库实现的Web应用,它能够在中国地图上创建热点区域,并在鼠标悬停时显示相关的地址文字提示。这个应用可能是一个交互式的...

    3种简单的css3鼠标悬停帮助图标显示图片文字提示框代码

    在这个主题中,我们将探讨三种简单的CSS3方法,用于在鼠标悬停帮助图标时显示图片和文字提示框。这将有助于提升用户对网站内容的理解,增强其互动性。 首先,我们来看第一种方法:使用伪类`:hover`和`&lt;img&gt;`元素。`...

    jQuery Tooltips悬停提示效果.zip

    在这个例子中,`.element`是需要添加提示效果的元素类名,`content`属性定义了提示显示的内容,`animation`设置了提示出现和消失的动画效果,而`position`则指定了提示的位置。 此外,你还可以根据项目需求进一步...

    jQuery鼠标悬停文字提示插件.zip

    jQuery.mytooltip插件允许开发者为网页元素添加动态的文字提示,这些提示可以在鼠标指针悬停时出现,并且可以根据需求设置不同的显示方向,包括上、下、左、右四个方向。这种功能在许多网站中非常常见,例如,当用户...

    jquery pinwheel提示插件仿新浪微博鼠标悬停图片头像提示用户个人

    特别是在社交网络平台,当用户鼠标悬停在头像上时,显示一个包含个人信息的提示框能为用户提供快速了解他人信息的便捷途径。本文将详细介绍如何使用jQuery Pinwheel插件来实现类似新浪微博的头像悬停提示功能。 ...

    Bootstrap鼠标悬停图片遮罩特效

    这里的`.d-none`和`.d-md-block`是Bootstrap提供的响应式类,它们用于在不同屏幕尺寸下控制元素的显示和隐藏。`.d-none`表示在所有尺寸下都隐藏,`.d-md-block`则意味着在中等及以上屏幕尺寸下显示。 接下来,我们...

    幻灯片图片展示效果图鼠标悬停显示遮罩层文字

    "幻灯片图片展示效果图鼠标悬停显示遮罩层文字"是一个常见的交互设计模式,用于提升用户对网页内容的互动性和理解性。这种设计常见于产品展示、新闻轮播或图片库等场景,允许用户在不离开当前页面的情况下获取更多...

    js 6款图片鼠标悬停效果JS代码,鼠标悬停在图片上后,文字标题以6种不同的动画形式出现,兼容主流浏览器

    本资源提供的是六种不同的图片鼠标悬停效果JS代码,这些代码旨在提升用户体验,当用户将鼠标指针悬停在图片上时,图片的文字标题会以独特的动画形式展现出来。这样的功能不仅能够增加网页的视觉吸引力,还能帮助用户...

    CSS3动画悬停显示文字特效.zip

    在本项目中,"CSS3动画悬停显示文字特效.zip"是一个包含JavaScript特效,特别是针对文字特效的应用。这个效果主要用于增强用户体验,当用户将鼠标悬停在图片上时,会通过滑动动画展示相关的标题文字信息。这既是一种...

    css3 悬停选框_css悬停选框_

    CSS3悬停选框是一种利用CSS3特性实现的交互效果,通常用于图像或链接,当鼠标悬停时,会显示一个包含相关信息的框。这种效果可以增强用户界面的互动性和吸引力,提供更好的用户体验。在本资源包中,你将找到一个名为...

    HTML5超链接悬停显示图片特效.zip

    这个"HTML5超链接悬停显示图片特效"是一个利用HTML5和JavaScript技术实现的功能,旨在提升用户对网站内容的交互性。当用户将鼠标光标悬停在超链接上时,它会展示一个预设的图片,甚至可以实现多张图片的切换效果,...

    CSS3鼠标悬停图片显示遮罩特效代码

    开发者可以根据自己的需求调整颜色、透明度、字体等细节,以适应不同的网站设计和内容展示需求。这个效果的实现依赖于CSS3的先进功能,如伪类选择器、过渡(transition)和透明度控制,这些都是现代网页设计中不可或...

Global site tag (gtag.js) - Google Analytics