2016-10-30 3 views
0

ziemlich neu zu js. Ich habe ein einfaches Projekt, in dem alles, was ich habe, ein Bild ist, das doppelt so hoch ist wie der Bildschirm. Ich möchte, dass die Webseite unten auf der Seite geöffnet wird. Daher habe ich in javascript die Funktion "window.scroll" funtion hinzugefügt. Das funktioniert gut ... die meiste Zeit. Manchmal, besonders wenn ich auf einem mobilen Gerät mit einem Heimserver teste, wird das Javascript einfach nicht gestartet und die Seite beginnt ganz oben. Meine Hauptfrage ist also: Gibt es eine Möglichkeit, das gleiche wie "window.scroll" zu tun, aber mit CSS, js ganz zu umgehen? Und eine zweite Frage, die ich haben würde, ist warum Javascript so flockig ist? Ich bin wirklich neu in der Webentwicklung und ich habe schon zweimal (das andere Mal mit der "slide" -Methode) css anstelle von js verwendet, weil js nicht richtig funktioniert, oder es muss im Cache gespeichert werden usw. ... ist das normales Verhalten oder nur ich wirklich schlecht es zu diesem Zeitpunkt zu schreiben? Vielen Dank für Ihre Zeit. PJavaScript fehlerhaft mit Startpunkt funciton

Hier ist der einfache Code:

$(document).ready(function(){ 
 

 
    window.scroll(0,2000); 
 

 
});
body { 
 
    margin: 0px; 
 
    padding: 0px; 
 
} 
 

 
img { 
 
    width: 100%; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
    <html> 
 
    <head> 
 
    \t <title>Test</title> 
 
    \t <link rel="stylesheet" type="text/css" href="styles.css"> 
 
    \t <script type="text/javascript" src="jquery.js"></script> 
 
    \t <script type="text/javascript" src="script.js"></script> 
 
    
 
    </head> 
 
    <body> 
 
     <img src="https://pixabay.com/static/uploads/photo/2016/10/18/21/22/california-1751455_960_720.jpg" width="100%" style="display: block;"> 
 
    </body> 
 
    </html>

CSS:

body { 
    margin: 0px; 
    padding: 0px; 
} 

img { 
    width: 100%; 
} 

JavaScript:

$(document).ready(function(){ 

    window.scroll(0,2000); 

}); 

Antwort

0

I denke, das Problem ist, dass das Bild braucht Zeit zum Laden. So denke ich, dass Ihr Ereignis ausgelöst wird, aber das Bild lädt später und ändert die Seitengröße erneut. Das Ladeereignis wird ausgelöst, nachdem Bilder geladen wurden.

versuchen Sie stattdessen diesen Code:

$(window).on("load", ,function(){ 

    window.scroll(0,2000); 

}); 
+0

Ok danke, schreibe ich den Code anstelle der $ (document) .ready (function() Funktion oder anstatt es Ich habe noch andere Funktionen, die ich innen laufen? Die Funktion document.ready – Paul

+0

@Paul Dieser Code ersetzt Sie JavaScript –

+1

Ich würde auch vorschlagen, etwas wie 'window.scroll (0, document.body.clientHeight);', wenn Sie nach unten scrollen wollen, so wie Sie Scrollen Sie immer nach unten, unabhängig davon, wie hoch der Inhalt ist (dh Sie können einen hart codierten Wert vermeiden und den Browser für sich arbeiten lassen. – Dymos

Verwandte Themen