Implement picture Scrolling

Briefly:

Brief code:

<! DOCTYPE html>"http://www.w3.org/1999/xhtml">"Content-type"Content="text/html; Charset=utf-8"/> <title> scrolling picture effects </title> <script src="Http://cdn.bootcss.com/jquery/2.1.1/jquery.js"></script> <script src="Http://cdn.bootcss.com/velocity/1.2.3/velocity.js"></script> <style type="Text/css">Div:not (: Last-of-type) {width: the%;height:750px;margin:0Auto; } Div:first-of-type{background:url (imgs/1. jpg); background-Size:cover;} Div:nth-of-type (2) {Background:url (imgs/2. jpg); background-Size:cover;} Div:nth-of-type (3) {Background:url (imgs/3. jpg); background-Size:cover;} Div:nth-of-type (4) {Background:url (imgs/4. jpg); background-Size:cover;} Div:nth-of-type (5) {Background:url (imgs/5. jpg); background-Size:cover;} Div:nth-of-type (6) {Background:url (imgs/6. jpg); background-Size:cover;} Div:nth-of-type (7) {Background:url (imgs/7. jpg); background-Size:cover;} Div:last-of-type{position:fixed; top:130px;right:50px;} Div:last-of-type ul{list-Style:none;} Div:last-of-type ul li{width:30px;height:30px;background:black;margin:3px;color:white;text-align:center;line-height:30px;} Div:last-of-type ul li:hover {cursor:pointer;} </style>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul> </div></body>"Text/javascript">    $("Div:last ul Li"). Click (function () {varNumli = $ ( This). text (); $("Div:last ul Li"). CSS ({"Background-color":"Black","Color":" White"});//each time the Li background color is initialized, click on which to change which Li's background color and font color        Switch(Numli) { Case "1": $("Div:first"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "2": $("Div:eq (1)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "3": $("Div:eq (2)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "4": $("Div:eq (3)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "5": $("Div:eq (4)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "6": $("Div:eq (5)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break;  Case "7": $("Div:eq (6)"). Velocity ("Scroll", {duration: -}); $( This). CSS ({"Background-color":" White","Color":"Black"}); Break; }    }); </script>

Implement picture Scrolling