Javascript-based logo image prompting effect code _ javascript tips-JS tutorial

This article mainly introduces the code of the logo image prompting effect implemented by JS, and involves implementation techniques related to page element traversal modification triggered by JavaScript mouse events. It has some reference value, if you need it, refer to the example in this article to describe the effect of the logo image prompts implemented by JS. Share it with you for your reference. The details are as follows:

This is a JavaScript-based mouse tip effect. The car Logo displays the tip effect-when the mouse moves, the logo image is displayed. the logo is not displayed after the page is opened, only when the mouse moves on the logo, the logo suddenly appeared. Similar to Js prompts for special effects, the compatibility of this Code is also well written, and the code is not complicated. Most of them call images.

The running effect is as follows:

The Online Demo address is as follows:

Http://demo.jb51.net/js/2015/js-car-ico-alert-style-demo/

The Code is as follows:

 Prompt box effect-logo display prompt effectScript window. onload = function () {var oLi = document. getElementsByTagName ("li"); var oA = document. getElementsByTagName ("a"); var oImg = document. getElementsByTagName ("img"); for (var I = 0; I <oLi. length; I ++) {oA [I]. index = oImg [I]. index = I; oA [I]. onmouseover = function () {oLi [this. index]. className = "zindex"; oImg [this. index]. style. display = "block"}; oA [I]. onmouseout = function () {oLi [this. index]. className = ""; oImg [this. index]. style. display = "none"}; oImg [I]. onmouseover = function () {oLi [this. index]. className = "zindex"; this. style. display = "block"}; oImg [I]. onmouseout = function () {oLi [this. index]. className = ""; this. style. display = "none" }}} script
Vehicle logo display-move the mouse over to display the logo
 
 
 
  
  
 BMWBMW
 
  
  
 Alfa RomeoAlpha romio
 
  
  
 SkodaSkoda
 
  
  
 VolkswagenVolkswagen
 
  
  
 SaabSabb car
 
  
  
 LamborghiniLamborghini
 
  
  
 PorschePorsche
 
  
  
 PeugeotPeugeot
 
  
  
 Mercedes1Mercedes
 
  
  
 BuickBuick Motor
 
 
 

I hope this article will help you design JavaScript programs.