2016-04-11 9 views
0

Ich habe versucht, die Breite von div dynamisch während des Scrolling.Aber es funktioniert nicht.Ich habe jquery-1.11.3.min.js in meinem Verzeichnis und verbinden Sie es mit HTML-Datei.Die Scrollfunktion in mein Skript erscheint in braun statt in schwarz.Scroll-Funktion funktioniert nicht

Das ist mein HTML-Datei

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<script src="jquery-1.11.3.min.js"></script> 
<link rel="stylesheet" href="BooksExchanger.css"/> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
</head> 
<script src="BooksExchanger.js"></script> 
<div id="packet"style="position:fixed"> 
<h1 id="welcome" >Welcome</p> 
<h2 id="about">You Are Now Entering Into BBE</h2> 
</div> 
<img src="1.jpg"/> 
<img src="2.jpg"/> 
</body> 
</html> 

Dies ist meine JS-Datei (BooksExchanger.js)

$(document).ready(function(){ 
     var scroll_pos = 0; 
       $(document).scroll(function() { 
        scroll_pos = $(this).scrollTop(); 
        if(scroll_pos < 10) { 
         $("#welcome").css('width', 75); 
        } else if(scroll_pos > 25 && scroll_pos < 75) { 
         $("#welcome").css('width', 100); 
        } else if(scroll_pos > 75 && scroll_pos < 100){ 
         $("#welcome").css('width', 125); 
        }else if(scroll_pos > 100){ 
         $("#welcome").css('width', 150); 
      } 
     }); 
    }); 
+0

seine Arbeit gut prüfen https://jsfiddle.net/71uvvb3L/ – RRR

Antwort

0

versuchen Sie das Scroll-Ereignis $(window) statt $(document)

Verwandte Themen