Also habe ich versucht, ein Bild an die Fenstergröße anzupassen. Gibt es eine Möglichkeit, ein div auf die Fensterbreite zu skalieren, während die richtigen Verhältnisse mit einem Event-Listener beibehalten werden? Ich habe durch das Internet geschaut, aber nichts hat funktioniert. Ich denke, dass es solche Sachen benutzen wird. Bei Größenanpassung auf Fensterbreite erweitern, Höhe = 5/3 Breite. Es wird höchstwahrscheinlich einen EventListener verwenden. Ich habe versucht, Breite 100%, aber das schneidet nur den unteren Rand des Bildes nicht lassen Sie mich nach unten scrollen, um den Rest zu sehen.setzen div zu Fenstergröße mit JavaScript mit HTML-Datei verknüpft
Antwort
Set Bildbreite bis 100%, nicht setzen eine Höhe und das Bild wird Seitenverhältnis beibehalten.
<body>
<img src="..." style="width: 100%" />
</body>
Siehe Beispiel: http://codepen.io/jessegavin/pen/QNzeaX
ich habe versucht aber das Problem ist, dass auf diese Weise der untere Teil des Bildes abgeschnitten wird, damit es abwärts scrollen kann. – sharkyevno
Diese Technik kann möglicherweise den unteren Teil des Bildes abschneiden, aber Sie können noch scrollen. – jessegavin
es funktioniert jetzt danke für die Hilfe – sharkyevno
diesen Code Versuchen
window.onresize = function(){
div.style.width = window.innerWidth + 'px';
div.style.height = window.innerHeight + 'px';
}
danke ich werde versuchen – sharkyevno
CSS ist der Weg Sie gehen sollten. width: 100%;
ist eine Sache, die Sie gehen können. Wenn Ihr Darstellungsbereich jedoch skalierbar ist, sollten Sie width: 100vw;
verwenden.
- 1. Scaling ein div mit Fenstergröße
- 2. einstellen Fenstergröße mit Javascript-Formular Aktion
- 3. dynamisch die Karussellbreite auf die Fenstergröße setzen
- 4. Javascript wird nicht mit HTML verknüpft
- 5. div Breite ändern mit Medienabfragen, wenn Fenstergröße ändern
- 6. Resize div zusammen mit Inhalt innen nach Fenstergröße
- 7. Cubism.js mit Fenstergröße ändern
- 8. Scrollbalken außerhalb div mit automatischem Überlauf setzen
- 9. Setzen Sie Max-Höhe mit Javascript
- 10. Erstellen dynamischer div mit Javascript
- 11. Änderung DIV Sichtbarkeit mit JavaScript
- 12. Div Sichtbarkeit mit Javascript - Problem
- 13. Wie height div auf Fenstergröße ändern?
- 14. Umdrehen eines Div mit Javascript
- 15. Fill div mit html mit Javascript/jquery
- 16. Ereignis zu assoziieren mit div
- 17. Javascript-Funktion Fenstergröße und -breite ändern Größe
- 18. create multiple span innerhalb div mit Javascript
- 19. Ist Javascript dynamisch oder statisch mit dem HTML verknüpft?
- 20. Bootstrap-Taste mit Eingabesteuerung verknüpft funktioniert nicht
- 21. html in einen iframe setzen (mit JavaScript)
- 22. Dynamisch setzen Auswahl-Optionen mit JavaScript
- 23. Javascript: Kann Übergang mit querySelector setzen
- 24. Setzen Sie Platzhalter mit jQuery/Javascript
- 25. Daten können nicht mit d3 verknüpft werden
- 26. Hinzufügen einer anderen Klasse zu einem Div mit Javascript
- 27. Wie div Hintergrundfarbe mit JavaScript zu entfernen, wenn Klasse gefunden
- 28. Hide/Show div mit Javascript, wenn ein div hat Scrollbar
- 29. Gekippte Div und Objekt mit JavaScript erstellen
- 30. Drehbares Bild oder div mit Javascript?
Muss das eigentlich mit dem JavaScript gemacht werden oder reicht das einfach in CSS? – BSMP
Willkommen bei Stack Overflow! Fragen, die Code-Hilfe suchen, müssen den kürzesten Code enthalten, der für die Reproduktion in der Frage selbst erforderlich ist **. Obwohl Sie einen [** Link zu einem Beispiel oder einer Site ** angegeben haben] (http://meta.stackoverflow.com/questions/254428/something-in-my-web-site-or-project-doesnt-work- can-i-just-einfügen-a-link-to-it), sollte die Verknüpfung ungültig werden, würde Ihre Frage keinen Wert für andere zukünftige SO-Benutzer mit dem gleichen Problem haben. –
Mögliche Duplikate von [Responsively ändern div Größe beibehalten Seitenverhältnis] (http://stackoverflow.com/questions/12121090/responsively-change-div-size-keeping-aspect-ratio) – BSMP