mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 26.04.2024 11:04 Benutzername: Passwort: Auto-Login

Thema: Hover vom 22.12.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Hover
Autor Nachricht
Blodsfana
Threadersteller

Dabei seit: 21.11.2004
Ort: Momentan aus Melsungen
Alter: 38
Geschlecht: Weiblich
Verfasst Sa 22.12.2007 14:46
Titel

Hover

Antworten mit Zitat Zum Seitenanfang

Ich möchte gerne wenn ich mit der maus über eine verlikte grafik gehe eine hoverbox haben wo inhalte drin stehen die ich auslesen kann

Zum beispiel in der Box soll stehen "{user.username} ist seit dem {user.regdatum} registriert.

Die box sollte 80% sichtbar sein eben opacity.

Wie mache ich das ohne javascript das es gut aussieht eventuell mit rounded corners?
  View user's profile Private Nachricht senden
pixelpapst303

Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht: Männlich
Verfasst Sa 22.12.2007 15:06
Titel

Antworten mit Zitat Zum Seitenanfang

hier kannst du dir schon mal einiges an anregungen und lösungsansätze holen:

http://aktuell.de.selfhtml.org/artikel/css/infobox/
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Kraat

Dabei seit: 05.10.2006
Ort: Köln
Alter: 42
Geschlecht: Männlich
Verfasst Sa 22.12.2007 15:08
Titel

Antworten mit Zitat Zum Seitenanfang

http://www.html.it/articoli/nifty/index.html
http://www.css4you.de/moz-opacity.html
http://www.webbe.de/index.shtml?CONTENT=script_css_tooltip;LANG=de

Alles was Du brauchst ^^
Musst es nur ein bisschen anpassen;)

Frohes Fest

edit: zu langsam *hu hu huu*


Zuletzt bearbeitet von Kraat am Sa 22.12.2007 15:09, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
pixelpapst303

Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht: Männlich
Verfasst Sa 22.12.2007 15:11
Titel

Antworten mit Zitat Zum Seitenanfang

Kraat hat geschrieben:

edit: zu langsam *hu hu huu*


... aber ausführlicher *zwinker*

Kraat hat geschrieben:

Frohes Fest



ebenfalls!!!
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Blodsfana
Threadersteller

Dabei seit: 21.11.2004
Ort: Momentan aus Melsungen
Alter: 38
Geschlecht: Weiblich
Verfasst Sa 22.12.2007 15:18
Titel

Antworten mit Zitat Zum Seitenanfang

das ist ja alles schön und gut aber nicht das was ich meinte. ich suche sowas wie auf:
http://beisefoerth.westside-communications.de/index3.htm
Also links im Bild da wo die Symbole sind.

Ansonsten habe ich das hier.

Code:
<SCRIPT language=JScript>
tags=new Array(
   'a',
   'img'
   );

 bg_color='ffffff';
 text_color='black';
 font='arial';
 text_size='9';
 opacity='80';

d=document;
document.write('<div id="floating_info" style="padding:1 3;position:absolute;border-top-width: 1px;border-right-width: 1px;border-bottom-width: 1px;border-left-width: 1px;border-top-style: dotted;border-right-style: solid;border-bottom-style: solid;border-left-style: dotted;border-top-color: 777777;border-right-color: 333333;border-bottom-color: 333333;   border-left-color: 777777; background:ffffff;font:bold '+text_size+'px '+font+';color:'+text_color+';display:none;width:150;z-index:2000;filter:alpha(opacity='+opacity+')"></div>')
document.onmousemove=move;
document.onmouseout="info('','off')"
function info(tip,optiune){
b=document.getElementById('floating_info')
if (optiune=='on'){
b.style.display="block";
b.innerHTML=tip;
}
if (optiune=='off'){b.style.display="none";b.innerHTML=''}
}


function move(){
b=document.getElementById('floating_info')
if(event.clientX<d.body.clientWidth-120)
   {b.style.left=event.x+9+d.body.scrollLeft;}
else   {b.style.left=event.x-108+d.body.scrollLeft;}

if(event.clientY>d.body.clientHeight-50)
   {b.style.top=event.y-40+d.body.scrollTop;}
else   {b.style.top=event.y-20+d.body.scrollTop;}
}


function over(){
for(k=0;k<tags.length;k++){
 obj=d.getElementsByTagName(tags[k])
 for(i=0;i<obj.length;i++){
    if(obj[i].getAttribute('info')){
   obj[i].onmouseover = function(){info(this.getAttribute('info'),'on')};
   obj[i].onmouseout = function(){info('','off')};
   }}
}
};

window.onload=over
</SCRIPT>


Nur wenn ich das angebe funktionieren zwar die tooltips aber komischerweise stört dies die eventanzeige auf der seite. es zeigt den eventtitel an aber nicht die bilder.

test unter HTTP://beta.germania-dating.com

Habe das mit den tooltips ja zum laufen bekommen aber was nutzt es mir wenn deswegen die events nicht angezeigt werden.
  View user's profile Private Nachricht senden
 
Ähnliche Themen hover-Button/hover-Bild wird darunter eingefügt
box hover mit css
CSS a:hover IE 5.01
Hover und ie
:hover und ie6
Div bei Hover austauschen
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.