• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Ranzoomen eines Icons innerhalb des Bildes beim drüberfahren

P

psylo

New member
Hi Leute !

Ich bin derzeit in der Ausbildung als Mediengestalter soll allerdings den Webbereich übernehmen. Ich kann HTML / CSS und etwas Php bin derzeit aber am ausbauen meiner Skills JS kommt derzeit dazu.

Es geht um folgendes (dieses Bild) :



SNIPP.PNG

Dieser Blaue Pin den ich eingefügt habe soll folgende Funktion kriegen: Er soll größer werden wenn man drüber fährt, ebenso soll dann ein Bild von demjenigen aus dem Wahbezirk erscheinen sowie eine kurze Information über ihn. Könnt ihr mir da irgendwie weiterhelfen? Ist wirklich sehr wichtig..

Schwierigkeitsgrad eurer Meinung nach (1 bis 10) ?

Lg psylo
 
JS-Schwierigkeit: 0

Da man das besser mit CSS realisiert... ;)

PS: der Pin muss natürlich als separates Bild vorliegen - muss er aber auch für eine JS Lösung, wenn man das unbedingt mit JS machen will/muss.

psylo schrieb:
Könnt ihr mir da irgendwie weiterhelfen?
Zum Vergrößern anklicken....
Klar - was willst du denn genau wissen?
 
Also wenn du mir ein paar Funktionen(welche ich benötige) und evtl was kleines zur Inspiration geben könntest wäre das echt super, ich will auf keinen Fall was fertiges kriegen.. Man muss sich das so vorstellen : Ein Hobbyzocker und damaliges Scriptkiddy bekommt durch gutglück eine Ausbildung 1 Woche bevor alle anfangen, hat sie nun und wird direkt ins Kalte Waser geworfen indem er schon direkt volle Kundenaufträge entgegennehmen muss.. sprich ich lern hier nix ich lerne nur durch mich. Das finde ich auch total super weil man nur genau so wächst, habe aber Druck vom Chef im Nacken.. Natürlich wäre es besser wenn ich was gezeigt kriegen würde aber ich denke Eigeninitiative ist bei ALLEM einfach das A und O :). Daher denke ich dass Ihr hier zukünftig noch eine Menge von mir hören werdet :D
 
Puh... keine Ahnung, was du brauchst. Wie gesagt, ich würde das mit CSS machen:
Code: 
<!DOCTYPE html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
<style type="text/css">
#pin {
	position: absolute;
	top: 100px;
	left: 100px;
	margin: -11px;
	border: 1px solid black;
	width: 20px;
	height: 20px;
	overflow: visible;
}
#pin .details {
	display: none;
}

#pin:hover {
	margin: -16px;
	width: 30px;
	height: 30px;
}
#pin:hover .details {
	display: block;
	position: absolute;
	top: 100%;
	left: -1px;
	border: 1px solid black;
}
</style>
</head>
<body>
<div id="pin">
	<div class="details">
		Mehr Information.
	</div>
</pin>
</body>
</html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben