Home JS special effects Picture special effects jQuery imitates the brightening and darkening effect of Jingdong pictures

jQuery imitates the brightening and darkening effect of Jingdong pictures

jQuery imitates the brightening and darkening effect of Jingdong pictures

jQuery imitates the brightening and darkening effect of Jingdong pictures. After hovering the mouse over the picture, the picture becomes brighter and other pictures become darker. Move the mouse away and all pictures will become brighter. Compatible with mainstream browsers, PHP Chinese website recommends downloading! Instructions: 1. The head area refers to the file lrtk.css and js library. animate.js is an animation function written separately. <link href=" css/lrtk.css" rel="stylesheet"/>

jQuery imitates the brightening and darkening effect of Jingdong pictures. After hovering the mouse over the picture, the picture becomes brighter and other pictures become darker. Move the mouse away and all pictures will become brighter. Compatible with mainstream browsers, PHP Chinese website recommends downloading!
Instructions:
1. The head area refers to the file lrtk.css and js library. animate.js is an animation function written separately.
<link href=" css/lrtk.css" rel="stylesheet"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/animate.js"></script>
<script type="text/javascript" src="js/lrtk.js"></script>
2. class="one" represents a div block that can hold two pictures in one column. class="two" represents a div block that can hold one picture in one column. The text description is in the corresponding
Modify the div block with class text
3. In the js code, the opacity parameter adjusts the transparency, and the third parameter adjusts the speed
animate(imgs[i],{left:0,opacity:1},100);
Disclaimer

All resources on this site are contributed by netizens or reprinted by major download sites. Please check the integrity of the software yourself! All resources on this site are for learning reference only. Please do not use them for commercial purposes. Otherwise, you will be responsible for all consequences! If there is any infringement, please contact us to delete it. Contact information: admin@php.cn

Related Article

jquery waterfall flow LightBox picture box special effects jquery waterfall flow LightBox picture box special effects

06 Jul 2016

jquery waterfall flow LightBox picture box special effects

CSS3 Practical Development: Teach you step by step how to develop mouse-over picture animation effects (Part 2)_html/css_WEB-ITnose CSS3 Practical Development: Teach you step by step how to develop mouse-over picture animation effects (Part 2)_html/css_WEB-ITnose

24 Jun 2016

CSS3 practical development: teach you step-by-step how to develop mouse-over picture animation special effects (Part 2)

css special effects_html/css_WEB-ITnose css special effects_html/css_WEB-ITnose

24 Jun 2016

css special effects

HTML&css&j special effects_html/css_WEB-ITnose HTML&css&j special effects_html/css_WEB-ITnose

24 Jun 2016

HTML&css&j special effects

61 web page special effects, very fashionable and with good visual effects_html/css_WEB-ITnose 61 web page special effects, very fashionable and with good visual effects_html/css_WEB-ITnose

24 Jun 2016

61 web page special effects that are very fashionable and have great visual effects

Animated loading effects implemented in pure css3_html/css_WEB-ITnose Animated loading effects implemented in pure css3_html/css_WEB-ITnose

24 Jun 2016

Animation loading special effects implemented in pure css3

A batch of hover effects implemented by CSS3_html/css_WEB-ITnose A batch of hover effects implemented by CSS3_html/css_WEB-ITnose

24 Jun 2016

A batch of hover special effects implemented by CSS3

Revealing the special effects in Tencent's burberry event page_html/css_WEB-ITnose Revealing the special effects in Tencent's burberry event page_html/css_WEB-ITnose

24 Jun 2016

Revealing the special effects in Tencent’s Burberry event page

CSS3 mouse slides over animated line border special effects CSS3 mouse slides over animated line border special effects

06 Jul 2016

CSS3 mouse slides over animated line border special effects

See all articles See all articles

Hot Tools

jQuery 3D picture slider carousel effect

jQuery 3D picture slider carousel effect

3D image Slider carousel effect based on jQuery

Pure CSS to achieve cool switching animations when the mouse passes through pictures

Pure CSS to achieve cool switching animations when the mouse passes through pictures

Pure CSS enables cool switching animation code downloads when the mouse passes through pictures.

HTML5 image carousel plug-in with parallax effect

HTML5 image carousel plug-in with parallax effect

An HTML5 picture carousel plug-in with parallax effect, which can control pictures with the mouse and produce a cool visual difference effect when the picture carousel is scrolled.

B site header image interactive mouse hover depth of field focus effect

B site header image interactive mouse hover depth of field focus effect

An interactive mouse-over depth-of-field focus effect web page special effect for the B site header image.

CSS3 mouseover image effect

CSS3 mouseover image effect

A CSS3 mouseover image effect