jQuery Web Page Scrolling Background Color Change Plugin
Add-ons
Plugin description: This scrolling plugin is built with jQuery, supports IE7, has minimal code, and is easy to use.
Last updated: 2019-10-13 22:38:31
Usage
Three files need to be included.
1 2 3 | <script src='dist/jquery.scrollie.min_1.js'></script> <script src="dist/script.js"></script> |
html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | <div class="main-wrapper"> <div class="slide slide-one" data-background="#3498db"> <div class="inside"> <p>Scroll down the page to change the background color</p> </div> </div> <div class="slide slide-two" data-background="#27ae60"> <div class="inside"> <p>This is the second screen. Watch the background color change.<br /> </div> </div> <div class="slide slide-three" data-background="#e74c3c"> <div class="inside"> <p>This is the third screen. Watch the background color change.</p> </div> </div> <div class="slide slide-four" data-background="#e67e22"> <div class="inside"> <p>This is the fourth screen. Watch the background color change.</p> </div> </div> <div class="slide slide-five" data-background="#9b59b6"> <div class="inside"> <p>This is the fifth screen. Watch the background color change.</p> </div> </div> <div class="slide slide-five" data-background="#34495e"> <div class="inside"> <p>This is the sixth screen. Watch the background color change.</p> </div> </div></div> |
Simply modify the corresponding data-background value for each screen.
评论