Bildgrösse automatisch anpassen

13.08.2017 15:19 (zuletzt bearbeitet: 13.08.2017 15:20)
#1
ts

Hallo allerseits

Ich habe ein mouseover-Effekt auf meiner Startseite erstellt, indem ich die beiden Bilder auf einer versteckten Seite hinterlegt habe. Die Bilder sind 1200px breit. Soweit klappte alles bestens.
Wie bekomme ich es nun hin, das sich dieser Effekt auf dem Monitor des Betrachters automatisch anpasst? Auch auf dem Handy und Tablet passt sich die Bildgrösse nicht an.

Nachfolgend der Mouseover-Code ...
<a href="Link"><img src="Originalbild" alt="" onmouseover=
"src='Bild-mouseover'" onmouseout=
"src='Originalbild'" /></a>


... und der Link zu meiner Seite
www.schuleerstfeld.ch

Ich danke im Voraus für eure Bemühungen.

mit liebem Gruss
Stefan


 Antworten

 Beitrag melden
13.08.2017 17:08
avatar  make
#2
ma

Versuchs mal damit:

1
2
3
 
<img src="https://image.jimcdn.com/app/cms/image/transf/dimension=1030x10000:format=jpg/path/s7e4c6fd4df740750/image/i75b07efcfd4fe1d6/version/1502611114/image.jpg" alt="" onmouseover=
"src='https://image.jimcdn.com/app/cms/image/transf/dimension=1030x10000:format=jpg/path/s7e4c6fd4df740750/image/if69bf85fd07ac728/version/1502611130/image.jpg'" onmouseout=
"src='https://image.jimcdn.com/app/cms/image/transf/dimension=1030x10000:format=jpg/path/s7e4c6fd4df740750/image/i75b07efcfd4fe1d6/version/1502611114/image.jpg'" alt="" width="100%" height="auto" />
 



Am Ende das

1
 
alt="" width="100%" height="auto"
 

ist wichtig.

Gruß
make


 Antworten

 Beitrag melden
14.08.2017 11:53
#3
ts

Lieber make

Ganz lieben Dank für den schnellen Tipp; es hat nun bestens geklappt.

liebe Grüsse
Stefan


 Antworten

 Beitrag melden
15.08.2017 09:01
#4
ts

Hallo zusammen
Hallo make

Ich melde mich nochmals.
Das gleiche Problem (einen Effekt auf dem Monitor des Betrachters anpassen) habe ich mit YouTube-Filmen, die ich via 'widget/html' auf meiner Seite erstellt habe. Zwar habe ich auf YouTube eine feste Grösse (680px mal 383px) generiert (es füllt dann schön die Seitenbreite aus; dies möchte ich gerne erhalten), aber wenn die Seitenbreite beim Betrachter kleiner ist, passt sich die Grösse nicht an. Gibt es da auch eine Möglichkeit mit einem zusätzlichen Code oder mit der Anpassung des generierten Codes oder bei YouTube einen anderen Code generieren, oder ... um eine Anpassung zu ermöglichen.

Nachfolgend der aktuelle Code:

1
 
<iframe width="680" height="383" src="https://www.youtube.com/embed/g2E7qu6sl_I?rel=0?ecver=1" frameborder="0" allowfullscreen=""></iframe>
 



Ich danke im Voraus für eure Bemühungen.

mit liebem Gruss
Stefan


 Antworten

 Beitrag melden
17.08.2017 16:13
avatar  az_
#5
avatar
az_

automatische Anpassung von iframes, da hilft eine %-Angabe bei der Breite. Die Höhe musst Du dann austesten.

...google mal nach "responsive iframe"
- https://benmarshall.me/responsive-iframes/
- https://stackoverflow.com/questions/1783...rame-responsive

LG, az


Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!


...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de


Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html


 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!