mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 10.12.2016 04:41 Benutzername: Passwort: Auto-Login

Thema: [css]bildwechsel mit hover und active vom 13.01.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> [css]bildwechsel mit hover und active
Seite: Zurück  1, 2, 3  Weiter
Autor Nachricht
joe

Dabei seit: 28.06.2005
Ort: berlin
Alter: -
Geschlecht: Männlich
Verfasst Fr 13.01.2006 11:33
Titel

Antworten mit Zitat Zum Seitenanfang

gib jedem menüpunkt eine eigene id. zum beispiel mp1, mp2, mp3 etc.

Wenn Home z.B. mp1 ist schreibst du in index.htm

Code:

<style>
#mp1{deine attribute für den active status}
</style>


Zuletzt bearbeitet von joe am Fr 13.01.2006 11:33, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
way2hot

Dabei seit: 14.03.2004
Ort: Jüchen-Gierath
Alter: 34
Geschlecht: Männlich
Verfasst Fr 13.01.2006 11:57
Titel

Antworten mit Zitat Zum Seitenanfang

joe hat geschrieben:
gib jedem menüpunkt eine eigene id. zum beispiel mp1, mp2, mp3 etc.

Wenn Home z.B. mp1 ist schreibst du in index.htm

Code:

<style>
#mp1{deine attribute für den active status}
</style>


Genau das. Sieht bei mir immer so aus:

Code:
a.startseite {
   width: 57px;
   background: url(../images/navi/button_startseite.jpg) no-repeat 0px 0px;
}
a.startseite:hover, a.startseite:active, a.startseiteActive {
   width: 57px;
   background: url(../images/navi/button_startseite.jpg) no-repeat 0px -12px;
}


Jeder Menüpunkt hat eine Klasse, bei der jeweils aktiven Seite änder ich dann die jeweilige Klasse auf den selbstdefinierten Aktivzustand.

Wer mir jetzt mit dem Background nicht folgen kann, möge sich bitte über "Sliding door" informieren.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
ZeroFlash
Threadersteller

Dabei seit: 11.02.2005
Ort: -
Alter: 33
Geschlecht: Männlich
Verfasst Fr 13.01.2006 12:04
Titel

Antworten mit Zitat Zum Seitenanfang

aso meint ihr das ... ich hab jetzt einfach das objekt in die includete php datei reingeschrieben, so dass es dann überlagert wird, wenn die datei geladen wird...
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 23
Geschlecht: Männlich
Verfasst Fr 13.01.2006 14:51
Titel

Antworten mit Zitat Zum Seitenanfang

fürn firefox reicht übrigens in einigen fällen :focus statt :active.
ie kann das allerdings wie so vieles nicht. da muss dann ne zweite klasse und js oder so her.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
ZeroFlash
Threadersteller

Dabei seit: 11.02.2005
Ort: -
Alter: 33
Geschlecht: Männlich
Verfasst Fr 13.01.2006 17:09
Titel

Antworten mit Zitat Zum Seitenanfang

ich steh grad aufm schlauch aber wie das mit ner zweiten klasse gehe soll raff ich nicht... kannst mir das bitte mal erklären
  View user's profile Private Nachricht senden
dizi

Dabei seit: 08.01.2005
Ort: Kölle
Alter: 31
Geschlecht: Männlich
Verfasst Fr 13.01.2006 18:01
Titel

Antworten mit Zitat Zum Seitenanfang

er meint das, was way2hot und joe schon vorgeschlagen ham.
  View user's profile Private Nachricht senden
Farco

Dabei seit: 08.01.2006
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Fr 13.01.2006 18:27
Titel

Antworten mit Zitat Zum Seitenanfang

Oder erstelle es mit Javascript (in diesem Fall mit dem von Fireworks):
Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])?args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) { img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr) for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}

function MM_preloadImages() { //v3.0
 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
   var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
   if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

//-->
</script>
</head>
<body onLoad="MM_preloadImages('subjekt_gr.gif');">
<a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','subjekt_kl','subjekt_gr.gif','subjekt_gr.gif',1);" onClick="MM_nbGroup('down','navbar1','subjekt_kl','subjekt_gr.gif',1);"><img name="subjekt_kl" src="subjekt_kl.gif" width="17" height="140" border="0" alt=""></a>
</body>
</html>


Kopiere es einfach mal raus und setzte es in die HTML-Datei ein. Die Verweise zu deinen Grafiken müssten stimmen.
LG Farco
  View user's profile Private Nachricht senden
ZeroFlash
Threadersteller

Dabei seit: 11.02.2005
Ort: -
Alter: 33
Geschlecht: Männlich
Verfasst Mo 16.01.2006 08:49
Titel

Antworten mit Zitat Zum Seitenanfang

danke, aber ich versuche auf javascript zu verzichten, da es sich ja in der navi befindet und wenn ein user js aus hat, dann geht ja gleich gar nix mehr
  View user's profile Private Nachricht senden
 
Ähnliche Themen [CSS/PHP/Javascript] CSS-Menu a:active soll sichtbar sein
css->active Link?
CSS a:active wird missachtet
[CSS] Hover in Css Klasse einfügen ?
Bildwechsel mit css - lässt sich da ein Link einbauen?
[JS/CSS] CSS-Hover mit JS animieren?
Neues Thema eröffnen   Neue Antwort erstellen Seite: Zurück  1, 2, 3  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


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.