kostenloser Webspace werbefrei: lima-city

jquery Makierungen in Bilder

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   gil-galad

   gil-galad hat kostenlosen Webspace.

   21:56, 6.7.2009

   Hallo,
   
   Ich möchte Personen auf einem Bilder makieren wie man es z. B. von facebook, myspace, ****VZ kennt.
   
   Ich habe mir überlegt das ganze mit dem jquery framework zu realisieren.
   
   Ich möchte einmal das man wenn man unter dem Bild über einen Link die Person makiert wird und wenn man in über ein Gesicht fährt ein Link erscheint.
   
   Grundsätzlich bekomme ich es auch so hin. Ich hätte aber gern eine elegantere Lösung.
   
   So habe ich es bzgl. der Links unter dem Bild "gelöst"
   
   

   $(document).ready(function(){
   	$("a.LINKCLASS").hover(
   		function(){
   			$('#DIVID').show();
   			return false;
   		}, 
   		function(){
   			$('#DIVID').hide();
   			return false;
   		}
   	);
   });

   
   
   bzgl. dem Link und den Hover effekt könnte man das ganze via CSS lösen.
   Die Boxen die um die Person erscheinen habe ich via css positioniert und auf display:none gesetzt
   
   Leider muss man bei der Lösung für jede Person alles einzeln definieren. Ich habe mich zwar schon an einer allgemeineren Form versucht es aber leider nicht hinbekommen.
   
   Wäre schön wenn mir jemand helfen kann. Kennt jemand vll. ein jquery Plugin mit dem das ohne Probleme funktioniert?

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. e********l

   10:04, 7.7.2009

   Die Positionen der Elemente wird das Plugin, falls es ein passendes gibt, auch einzeln positionieren. Du kannst die Styleangaben für das Aussehen ins CSS schreiben und die Positionierung als Inline-Style. Dann ist der Aufwand relativ gering gehalten.
4. Autor dieses Themas

   gil-galad

   gil-galad hat kostenlosen Webspace.

   23:20, 7.7.2009

   Hi,
   
   Danke für deine Antwort. Ich glaube ich habe mich nicht richtig ausgedrückt.
   
   Die Positionierung ist überhaupt nicht das Problem ich habe es auch in etwa so gemacht wie du beschrieben hast.
   
   Es geht um das JS und den "Hover" Effekt, ich hoffe es ist jetzt klar was ich meine.
   
   Ich bin noch auf eine andere Möglichkeit gestoßen nämlich anstatt es mit css zu machen sich die area Funktion zu Hilfe zu nehmen. Was haltet ihr davon?
   

5. bluemax

   bluemax hat kostenlosen Webspace.

   1:33, 20.7.2009

   Hallo,
   ehrlich gesagt halte ich die ImageMap/Area-Methode für schnell gemacht und effektiv. Sollte Dein Problem einfach lösen, WENN ich es richtig verstanden habe. Gutes How-To wie immer hier : http://de.selfhtml.org/html/grafiken/verweis_sensitive.htm.
   Vielleicht hilfts!
   Viele Grüße,
   BlueMax

6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?