Helpdesk
Menschen Wissenschaft Politik Mystery Kriminalfälle Spiritualität Verschwörungen Technologie Ufologie Natur Umfragen Unterhaltung
weitere Rubriken
PhilosophieTräumeOrteEsoterikLiteraturAstronomieHelpdeskGruppenGamingFilmeMusikClashVerbesserungenAllmysteryEnglish
Diskussions-Übersichten
BesuchtTeilgenommenAlleNeueGeschlossenLesenswertSchlüsselwörter
Schiebe oft benutzte Tabs in die Navigationsleiste (zurücksetzen).

mouse hoover zoom effekt für bilder

18 Beiträge ▪ Schlüsselwörter: Html, CSS, Mouse Hoover Effect ▪ Abonnieren: Feed E-Mail
Seite 1 von 1
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 00:05
grüße euch


habe eine frage u zwar brauche ich die programierungsbefehle für meine homepage für html u css für einen effekt für bilder. u zwar in dem ich mit der maus auf ein bild gehe u dieses dann größer wird nach meinem belieben

kann mir da jemand helfen?

ich suche schon seit tagen nun im internet nach den befehlen für html u konnte nichts aufschlussreiches finden

gruß george


melden

mouse hoover zoom effekt für bilder

25.07.2013 um 00:23
@georgerus
Also mit CSS, kannst du scale auf die Klasse legen - der wert des scale ist mal die Große
also scale(2) = verdopplung der größe


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 00:34
@RobbyRobbe

ok also brauch ich dann im html garnichts mehr zu machen?

u wie schreib ich das genau im css? zu dem entsprechenden bild


melden

mouse hoover zoom effekt für bilder

25.07.2013 um 00:45
@georgerus
So - bissl geschustert - aber denke das es um einiges einfacher geht - ist aber so spät

Das muss in die HTML:
[objerror]Bild nicht mehr verfügbar ((hier bild url))[/objerror]


Und das CSS:
<style> #pic img{top:200px;left:-200px;position: relative; transform: scale(20); -webkit-transform: scale(20); -moz-transform: scale(20); -o-transform: scale(20); -ms-transform: scale(20); } #pic img:hover{top:200px;left:-200px;position: relative; transform: scale(20); -webkit-transform: scale(20); -moz-transform: scale(20); -o-transform: scale(20); -ms-transform: scale(20); } </style>

Aber ich würde davon abraten :D


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 00:47
@RobbyRobbe
danke erstmal. das muss ich auch erst mal morgen genauer ansehen.heute geht das nimmer:)

u wieso würdest mir abraten davon?


melden

mouse hoover zoom effekt für bilder

25.07.2013 um 00:50
@georgerus
Fuuu das Scale im noralen 1 und beim anderen z.B. 2 und nicht 20 :D

Btw. schon so spät :mozart:


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 00:51
@RobbyRobbe
ja reden wir morgen weiter ok

ich komm grad nicht mit:)


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 09:50
Möchtest du, dass das große Bild plötzlich aufploppt, wenn man mit der Maus darüber fährt oder soll es ein stufenweises, flüssiges größer werden sein?


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 21:09
@Bodo

hi letzteres:)

https://www.google.de/search?hl=de&site=imghp&tbm=isch&source=hp&biw=1366&bih=665&q=linoldruck&oq=linoldruck&gs_l=img.3..0l10.593.3161.0.3430.10.6.0.4.4.0.298.1385.1j0j5.6.0....0...1ac.1.22.img..1.9.1160.MBejiQVSUJk
so ungefähr...aber das bild sollte dann ich einstellen können wie groß das dann ist


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 21:14
@georgerus
Ok, hab sowas heute in der Firma gefunden. Kanns dir morgen schicken :)


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

25.07.2013 um 21:16
@Bodo
oja wäre nett danke im voraus:)


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

26.07.2013 um 10:54
@georgerus
Soooooooooooo! Habs testweise auf meinem Profil mal reingestellt. Sorry für das image, hab nach bild gegoogelt :D

Der Teil gehört ins style-Tag:
.zoom { width: 25%; -webkit-transition: width 1.4s ease-in-out; -moz-transition: width 1.4s ease-in-out; -o-transition: width 1.4s ease-in-out; transition: width 1.4s ease-in-out; } .zoom:hover { width: 100% !important; }
Dieser ins body-Tag:


Das wars eigentlich :)


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

26.07.2013 um 11:01
@Bodo

u oben ist fürs css?

u width 25% da kann ich auch weniger od mehr % einstellen?

u unten bei alt="" zwischen diese "" kommt nix rein od?


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

26.07.2013 um 11:19
@georgerus
Ja, oben ist der Code für css.

Natürlich: der %-Wert gibt die Größe des Fotos an, wenn man nicht mit der Maus darüber ist. Mehr als 100% lässt das Bild bei einem Mouse Over schrumpfen. Einfach mal ausprobieren :)

Das alt steht für einen alternativen Text, wenn das Foto nicht angezeigt werden kann. Da kannst du alles reinschreiben, was du willst. Natürlich klug, wenn man etwas sinnvolles einträgt :)


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

26.07.2013 um 11:40
@Bodo

ok verstehe:) danke dir. ich werd das denk ich erstmal austesten, u dann mal sehen was so passiert. u dann wenn ich es gecheckt habe kommts in meine homepage

bei fragen meld ich mich nochmal


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

26.07.2013 um 11:47
@georgerus
Ja, kein Problem :)


melden
georgerus Diskussionsleiter
ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

31.07.2013 um 12:27
@Bodo
so ich habs jetzt mal probiert u die bilder sind alle weg?

was mach ich falsch


melden
Bodo ehemaliges Mitglied

Link kopieren
Lesezeichen setzen

mouse hoover zoom effekt für bilder

31.07.2013 um 12:30
@georgerus

Schick mir deinen Profilcode bitte per PN. Ich gucks mir an.


melden

Ähnliche Diskussionen
Themen
Beiträge
Letzte Antwort
Helpdesk: Programmieren: Hilfe & Austausch
Helpdesk, 920 Beiträge, am 16.03.2024 von THX1138
accrec am 13.04.2011, Seite: 1 2 3 4 ... 43 44 45 46
920
am 16.03.2024 »
Helpdesk: CSS Frage: Image wird abgeschnitten ...
Helpdesk, 12 Beiträge, am 17.10.2014 von Sector7
AnGSt am 06.09.2014
12
am 17.10.2014 »
Helpdesk: Linux sudo Nutzer anlegen klappt nicht
Helpdesk, 6 Beiträge, am 17.03.2024 von NordicStorm
NordicStorm am 14.03.2024
6
am 17.03.2024 »
Helpdesk: Selbständig als Entwickler in der IT
Helpdesk, 6 Beiträge, am 16.05.2019 von gentoo
nocheinPoet am 21.02.2019
6
am 16.05.2019 »
von gentoo
Helpdesk: Powershell Interaktive Ein-Ausgabe
Helpdesk, 5 Beiträge, am 11.02.2016 von kokablue
neverbesuccess am 31.12.2015
5
am 11.02.2016 »