html鼠标移动上去文字闪动,onmouseover闪烁问题鼠标移动上去会不停的闪烁

布满荆棘的人生 2022-10-06 07:53 172阅读 0赞

onmouseover里面的innerHTML加两个div会闪烁，一个不会：

Title

\*\{

margin: 0;

padding: 0;

\}

\#box \{

width: 250px;

height: 350px;

border: 3px solid darkgrey;

\}

ul li\{

float: left;

margin: 20px 10px;

background-color: goldenrod;

list-style: none;

\}

ol \{

margin-top: 70px;

\}

ol li \{

height: 40px;

border-bottom: 1px solid gainsboro;

\}

ol li div\{

display: inline-block;

margin:0 15px;

\}

window.onload = function () \{

var box = document.getElementById('box');

var aOl = box.getElementsByTagName('ol');

var arrIMG = \['1.png','2.png','3.png','4.png','5.png','6.png'\];

function lis()\{//获得所有li

var olBox = null;

var aOli=\[\];// 存放所有li元素节点

for (var i=0;i

olBox = aOl\[i\].getElementsByTagName('li');

for(var j=0;j

aOli.push(olBox\[j\]);

\}

\}

return aOli

\}

function liHover(li,imgs)\{// hover时的效果

for(var i=0;i

li\[i\].index = i;

li\[i\].onmouseover = function () \{

this.innerHTML = '

![Image 1][]

' +

'

' +

'

#### 标题 ####

' +

'

内容内容内容内容

' +

'

';

\}

li\[i\].onmouseout = function () \{

this.innerHTML = this.index+1;

\}

\}

\}

var toLi = lis();

liHover(toLi,arrIMG);

\}

*  ### 每日 ###
 *  ### 每周 ###
 *  ### 每月 ###

1.  1
2.  2
3.  3
4.  4
5.  5
6.  6

1.  111
2.  222
3.  3333
4.  444
5.  555
6.  666

1.  1aa
2.  2aa
3.  3aa
4.  4aa
5.  5aa
6.  6aa

[Image 1]:

发表评论取消回复

表情：

评论列表（有 0 条评论，172人围观）

还没有评论，来说两句吧...

相关阅读

相关 html字体颜色闪动,HTML最简单的文字闪烁代码

该楼层疑似违规已被系统折叠隐藏此楼查看此楼 Title @keyframes blink\{ 0%\{opacity: 1;\} 50%\{opacity: 1;\}

约定不等于承诺〃/ 2022年10月09日 06:22/ 0 赞/ 289 阅读

相关 html鼠标移动上去文字闪动,onmouseover闪烁问题鼠标移动上去会不停的闪烁

onmouseover里面的innerHTML加两个div会闪烁，一个不会： Title \\{ margin: 0; padding: 0; \} \box \{

布满荆棘的人生/ 2022年10月06日 07:53/ 0 赞/ 173 阅读

相关 html 层显示隐藏闪烁,onmouseover/out 显示隐藏指定div 无闪烁问题

![21db255f698c645531a1c07ff9b06c5e.gif][] 从下面的这个例子中(可下载)可以了解到如何用onmouseover 显示指定div(htm

曾经终败给现在/ 2022年10月06日 07:51/ 0 赞/ 168 阅读

相关鼠标放上去的效果

其实比较简单实现的方法很多有些人喜欢先把div隐藏然后放上去的时候在显示鼠标离开的时候在隐藏个人不喜欢这样实现毕竟在加载的时候会多加载一个元素

男娘i/ 2022年08月24日 05:20/ 0 赞/ 172 阅读

相关实现点击单张图片,鼠标移动上去,两种状态下可放大

实现点击单张图片时要求可放大 1.官网jquery压缩版引用地址: 　3.1.1版本: 　　<script src="https://code.jquery.c

╰半橙微兮°/ 2022年05月20日 01:16/ 0 赞/ 209 阅读

相关鼠标移动事件

一介绍鼠标移动事件（onmousemove）是鼠标在页面上进行移动时触发事件处理程序，可以在该事件中用document对象实时读取鼠标在页面中的位置。二应用

快来打我*/ 2022年05月12日 00:00/ 0 赞/ 268 阅读

相关 CSS3 动画-- 鼠标移上去，div 会旋转、放大、移动

原文出处：[https://www.cnblogs.com/arealy/p/7737051.html][https_www.cnblogs.com_arealy_p_7737

超、凢脫俗/ 2022年05月10日 21:56/ 0 赞/ 333 阅读

相关鼠标移上去会进行一个平移并切换图片的效果

首先，为了能明显的看出来平移以后的距离，我们设置一个边框，把需要做出效果的div放入里面；先设置边框的div左右居中，上边距为100px，高为500px，宽800px，然后设置

桃扇骨/ 2022年04月23日 15:24/ 0 赞/ 237 阅读

相关 layui鼠标移上去的hover效果tips

效果： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3

待我称王封你为后i/ 2022年03月28日 10:26/ 0 赞/ 1013 阅读

相关鼠标移上去显示全部内容

引入js文件 (function($){ $.fn.toolTip = function(options) { //Providing plugin ...

红太狼/ 2021年04月19日 14:36/ 0 赞/ 632 阅读