Home > Developer > JavaScript
JS implements the method for non-stop flashing effect of the DIV layer corresponding to the clicked text, jsdiv
This article describes how to implement the non-stop flashing effect of the DIV layer corresponding to the clicked text in JS. Share it with you for your reference. The specific analysis is as follows:
In many entertainment websites, we often see this effect. by clicking the text in a certain square on the webpage, the entire square keeps flashing. This is a very good dynamic effect that can easily attract the attention of customers, this code achieves this effect. After clicking a square, the square will flash
Copy codeThe Code is as follows: <! 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 = UTF-8"/>
<Title> js click Text corresponding to DIV layer flashing </title>
<Style type = "text/css">
# Box {position: absolute; top: 50%; left: 50%; color: # fff; width: 200px; height: 200px; background: red; cursor: pointer; letter-spacing: 5px; text-align: center; font: 12px/200px Arial; margin:-100px 0 0-100px ;}
</Style>
<Script type = "text/javascript">
Window. onload = function ()
{
Var oBox = document. getElementById ("box ");
Var timer = null;
OBox. onclick = function ()
{
Var I = 0;
ClearInterval (timer );
Timer = setInterval (function (){
OBox. style. display = I ++ % 2? "None": "block ";
I> 6 & (clearInterval (timer ))
}, 80)
}
};
</Script>
</Head>
<Body>
<Div id = "box"> tips for helping customers: Click me and I will be able to flash </div>
</Body>
</Html>
I hope this article will help you design javascript programs.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
