html滚动字幕如何向下移动,按向下键的同时,菜单选项向下移动,浏览器右边的滚动条也跟着跑怎么办。这个bug怎么改...

是事件冒泡的锅吗?若果是,cancelbubble加到哪一行下面?若果不是应该怎么改.

下拉菜单

body,ul,li{ margin:0; padding:0; font-size:13px;}

ul,li{list-style:none;}

#divselect{width:186px; margin:80px auto; position:relative; z-index:10000;}

#divselect cite{width:150px; height:24px;line-height:24px; display:block; color:#807a62; cursor:pointer;font-style:normal;

padding-left:4px; padding-right:30px; border:1px solid #333333;

/*background:url(xjt.png) no-repeat right center;*/}

#divselect ul{width:184px;border:1px solid #333333; background-color:#ffffff; position:absolute; z-index:20000; margin-top:-1px; display:none;}

#divselect ul li{height:24px; line-height:24px;}

#divselect ul li a{display:block; height:24px; color:#333333; text-decoration:none; padding-left:10px; padding-right:10px;}

window.οnlοad=function(){

var box=document.getElementById('divselect'),

title=box.getElementsByTagName('cite')[0],

menu=box.getElementsByTagName('ul')[0],

as=box.getElementsByTagName('a'),

index=-1;

// 点击三角时

title.οnclick=function(event){

event = event||window.event;

menu.style.display = 'block';

if(event.stopPropagation){

event.stopPropagation();

}else{

event.cancelBubble = true;

}

document.onkeyup = function(event){

event = event||window.event;

if(event.keyCode==40){

index++;

if(index>=as.length) index=0;

for(var i=0; i

as[i].style.background = '#fff';

}

as[index].style.background = '#ccc';

}

if(event.keyCode==38){

index--;

if(index<0) index=as.length-1;

for(var i=0; i

as[i].style.background = '#fff';

}

as[index].style.background = '#ccc';

}

if(event.keyCode==13){

for(var i=0; i

as[i].style.background = '#fff';

}

title.innerHTML = as[index].innerHTML;

menu.style.display = 'none';

}

}

}

// 滑过滑过、离开、点击每个选项时

for(var i=0; i

as[i].num = i

as[i].onmouseover = function(){

this.style.background = '#ccc'

index = as[i].num-1;

}

as[i].onmouseout = function(){

this.style.background = '#fff'

}

as[i].onclick = function(event){

event = event||window.event;

if(event.stopPropagation){

event.stopPropagation();

}else{

event.cancelBubble = true;

}

menu.style.display = 'none';

title.innerHTML = this.innerHTML;

}

}

// 点击页面空白处时

document.onclick = function(){

menu.style.display = 'none';

}

}

请选择分类

  • ASP开发
  • .NET开发
  • PHP开发
  • Javascript开发
  • Java特效

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/552289.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c语言中文网 vc++6.0下载量_【新手必看】C语言开发环境,请查收!

C语言开发环境的选择&#xff0c;貌似是告诉我们&#xff0c;工欲善其事&#xff0c;必先利其器。01、Visual StudioVisual Studio&#xff08;简称 VS&#xff09;&#xff0c;它是 Windows 下的标准 IDE&#xff0c;VS系列为IDE&#xff08;集成开发环境&#xff09;&#xf…

hssfworkbook.write 生成文件 数据丢失_电脑文件丢失了,数据恢复我只用这一个软件!...

电脑使用久了&#xff0c;遇到硬盘数据丢失或者误删乃是常见之事。所以这样的事情发生之时&#xff0c;最重要的是找到一个明智的解决方法&#xff0c;切忌浮躁&#xff0c;一个不小心&#xff0c;可能造成更严重的后果。据不完全统计&#xff0c;当电脑文件丢失后&#xff0c;…

html如何让图片跟字体重叠,CSS设置图片与文字的间距

【实例介绍】CSS设置图片与文字的间距希望图片本身与文字有一定的距离只需要给标记添加margin属性即可。margin属性包括margin&#xff0e;top、margin-right&#xff0c;margin-bottom、margin—left、margin。属性margin可以用来同时设置图片的四边外边距&#xff0c;而其他的…

查看so库中是否有某个定义_论Linux ELF中动态库符号重定义利用 属性/Linker 做隐藏的手法...

假如libgetthree.so libgetseven.so , 同时这两个so内部都用了internal_do_calculation()函数&#xff0c;并且各自定义了自己的internal_do_calculation()的实现&#xff0c;你会想当然的认为他们各自不影响&#xff0c;libgetthree和libgetseven会分别用自己的internal_do_ca…

android 手写签批_Android手写签批功能实现(适配Android6

Android手写签批功能的实现在于三个点&#xff0c;mupdf&#xff0c;偏移量的计算&#xff0c;droidText0.5.jar实际步骤&#xff1a;使用muPdf将PDF加载出来弹出透明的popwindow&#xff0c;popWindow使用画板(一般签批我们都会用有笔锋的钢笔或者毛笔)将签批好的图片生成Bitm…

华为新系统鸿蒙能互通吗,「连接」万物的鸿蒙,能拯救华为手机吗?

为 IoT 而生的鸿蒙操作系统&#xff0c;其优势与特点几乎都是围绕「万物互联」展开的。在曝光两年之后&#xff0c;华为的鸿蒙系统终于正式和用户见面了。6 月 2 日&#xff0c;华为鸿蒙操作系统及华为全场景新品发布会开启&#xff0c;正式推出 HarmonyOS 2.0&#xff0c;并发…

c++中outtextxy_第12章 坚持一百秒(《C和C++游戏趣味编程》配套教学视频)

本章我们将编写坚持一百秒游戏&#xff0c;玩家通过鼠标控制火箭躲避一架UFO和越来越多的反弹子弹&#xff0c;效果如图所示。首先学习图片的导入和显示&#xff0c;并利用结构体实现一颗反弹的子弹&#xff1b;然后学习面向对象编程的知识&#xff0c;利用类和对象实现新版本的…

update yum 到指定版本_centos使用yum update升级到指定小版本

参考&#xff1a; https://www.cnblogs.com/configure/p/10918189.html提供一个搜狐镜像的7.6的yum源&#xff1a;[C7.6.1810-base]nameCentOS-7.6.1810 - Basebaseurlhttp://mirrors.sohu.com/centos/7.6.1810/os/$basearch/gpgcheck1gpgkeyfile:///etc/pki/rpm-gpg/RPM-GPG-K…

腾讯移动分析+html5,FAQ · 腾讯移动分析 文档

1. 常见问题1.1. 产品问题Q1:如何联系技术支持&#xff1f;目前问题统一在工单系统进行反馈&#xff0c;麻烦填写详细的信息&#xff0c;方便技术支持定位。Q2:腾讯移动分析是否付费&#xff1f;腾讯移动分析的现有功能都是免费的。Q3:自定义事件个数是否有限制&#xff1f;目前…

赛码行测题库_行测数字推理题库

实用文案 数字推理题 725 道详解 【 1 】 7 , 9 , -1 , 5 , ( ) A 、 4 ; B 、 2 ; C 、 -1 ; D 、 -3 分析 : 选 D , 7+9=16 ; 9+ ( -1 ) =8 ; ( -1 ) +5=4 ; 5+ ( -3 ) =2 , 16 , 8 , 4 , 2 等 比 【 2 】 3 , 2 , 5/3 , 3/2 , ( ) A 、 1/4</

dw中html颜色的设置颜色代码,Dreamweaver 如何编辑字体大小颜色

以下为学做网站论坛关于“Dreamweaver 如何编辑字体大小颜色”讲解视频教程。dreamweaver是个可视化的软件&#xff0c;你直接选中你要更改的设置&#xff0c;在编辑器中直接就可以更改了。或是用CSS也可以设置你说的那些内容字体大小、颜色样式。dreamweaver编辑字体大小、颜色…

python取出字典中最大值_python找出字典中value最大值的几种方法

假设定义一字典&#xff0c;m {"a":3,"e":6,"b":2,"g":7,"f":7,"c":1,"d":5}&#xff0c;在不知道key的情况下如何找出字典中value最大的所有key-value对&#xff1f;下面讨论几种方法。 1&#xff09…

html 图片position,【图解CSS#Position】

关于CSS position&#xff0c;来自MDN的描述&#xff1a;CSS position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left 属性则决定了该元素的最终位置。先看一个图片&#xff1a;child没设置position的样式代码如下&#xff1a;child1-1child1-2child1-3chi…

佳能g3800故障灯说明书_佳能打印机故障如何维修 佳能打印机故障维修方法【介绍】...

在现代办公中是离不开打印机的&#xff0c;一些办公文件都是需要用它来打印的&#xff0c;也因此在办公中的地位是很重要的。也正因此它要是出现了故障&#xff0c;会给我们带来很大的麻烦&#xff0c;很是影响工作进度。佳能是很知名的&#xff0c;即使是这样&#xff0c;它在…

ll微信2下载安装_【兰苑文学】:陈振 ll黄金槐

作者简介陈振&#xff0c;新余市作协会员&#xff0c;江西省优秀乡村教师&#xff0c;中国网络诗歌学会会员。作品见于《诗选刊》《诗歌月刊》《诗潮》《鸭绿江》《诗人》《作家报》《长江诗歌》《海口日报》印尼《千岛日报》和《2018江西诗歌年选》《中国民间短诗精选》《中国…

无法扩展该卷 因为群集的数量将超过文件系统_浏览器将支持Python项目!Mozilla发布Pyodide...

作者&#xff5c;Michael Droettboom 编译&#xff5c;王强、覃云 近日&#xff0c;Mozilla 发布了一个实验项目 Pyodide&#xff0c;旨在浏览器内运行一个完整的 Python 数据科学堆栈。链接&#xff1a;https://github.com/iodide-project/pyodide/Pyodide 的创意起源于 Mozil…

华锋e路航x10升级工具_万商云集:疫情下火爆的电子合同,背后是企业数字化升级的必然...

近年来&#xff0c;数字经济快速发展成为中国经济发展的新动能&#xff0c;作为企业数字化转型中非常重要的一环&#xff0c;电子合同也随着产业数字化程度的加深快速渗透到各行各业&#xff0c;万商云集早在去年年底就已经正式拥抱电子合同&#xff0c;助力客户实现数字化升级…

edge播放视频HTML5黑屏,Win10 edge浏览器播放视频黑屏解决方法

Edge看不了视频怎么办呢? 出现这样的问题是由于Edge浏览器中需要点击允许才能看视频&#xff0c;但如果不弹出提示窗口我们就无法正常观看视频&#xff0c;所以当我们遇到这样的情况可以按下面方法进行操作!Edge看不了视频解决步骤&#xff1a;1、按下winR 组合键打开运行&…

@async 如何返回list_图解 Await 和 Async

原文链接&#xff1a;Await and Async Explained with Diagrams and Examples文章目录简介Promise问题&#xff1a;组合 PromiseAsync 函数Await错误处理讨论简介JavaScript ES7中的 async/await 使得协调异步 promise 变得更容易。如果你需要从多个数据库或 API 异步获取数据&…

求一个向量变换为另一个向量的矩阵_OpenGL里旋转等变换矩阵为什么是4x4的矩阵...

OpenGL ES 的很多教程里都会有这样一个例子来讲解纹理&#xff1a;将一张图片作为纹理显示在屏幕上。因为纹理坐标和实际屏幕显示的坐标不一样&#xff0c;把图片渲染在屏幕上后&#xff0c;图片是上下颠倒的。一个解决方法是对当前的顶点坐标&#xff0c;乘以绕 z 轴旋转180度…