zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Dropdown - Hover-Effekt verschwindet

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 19.04.2011, 14:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.04.2011
Beiträge: 2
narjin befindet sich auf einem aufstrebenden Ast
Standard Dropdown - Hover-Effekt verschwindet

Liebe Communtiy,

ich hab eine Site mit einem Menüpunkt "Login" der ich ein Dropdownmenü gegeben habe um dort das Login-Forumlar, usw. zu hinterlegen.

Nun hat der Menüpunkt "Login" einen Hover-Effekt. Dieser verschwindet sobald ich aus dem Menüpunkt in die Dropdown-Box fahre.
Ich möchte aber das er bleibt.

Mein CSS:
Code:
.drop a.login-link{
    position:absolute;
    top:1px;
    right: 181px;
    text-transform:none;
    z-index:10;
    font-size: 14px;
    display:block;
    color:#47647b;
    cursor:pointer;
    padding:14px 10px 14px 17px;
}
.drop a.login-link:hover {
    background:url(../images/bg-nav-l.png) no-repeat;
    text-decoration: none;
}
.drop:hover .drop-holder {
    display: block;
}
.drop-holder{
    display: none;
    position: absolute;
    width: 575px;
    height: 225px;
    top: 37px;
    background-color: #fff;
    z-index: 99;
    margin: 0 28px;
    padding: 58px 90px 26px 66px;
}
Mein HTML:
HTML-Code:
<div class="drop">
                        <a href="fileadmin/templates/html/startseite/login.html" class="login-link" style="color: #A8101B;">
                            <strong>LOGIN</strong>
                        </a>

                        <div class="drop-holder">
                            <div id="login"><div class="tx-felogin-pi1">
		
<div class="login-form">
	<div class="title-box">
		<h1>Logout</h1>
	</div>
	<p></p>
	<form action="willkommen-login.html" method="post" class=" logout">

		<fieldset>
			<input type="hidden" name="logintype" value="logout" />
			<input type="hidden" name="pid" value="178" />
			<div class="login-field">
				<p>Das ist Ihr aktueller Status:</p>
				<p>Benutzername:</p> <div class="username"><p>test</p></div>
			</div>

			<input type="submit" name="submit" class="btn-submit btn-login" value="Logout" />
		</fieldset>
	</form>
</div>

	</div>
	</div>
Ich danke für jede Hilfe.

Mit freundlichen Früßen,

narjin
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 20.04.2011, 20:44
ofHouse
XHTMLforum-Mitglied
 
Registriert seit: 20.04.2011
Beiträge: 128
Borsti befindet sich auf einem aufstrebenden Ast
Standard

Ist eigentlich ganz klar, dass der Hover-Effekt verschwindet

Dein Hover-Effekt gilt nur für folgende Zeile:

HTML-Code:
<a href="fileadmin/templates/html/startseite/login.html" class="login-link" style="color: #A8101B;">
<strong>LOGIN</strong>
</a>
Sobald du dich also mit der Maus in dem <a>-Element befindest, wird der Hintergrund von dem Element mit :hover gesetzt.

Navigierst du dann mit der Maus zum Login, dann bist du nicht mehr im <a>-Element und deswegen gibt's auch kein hover-Effekt mehr.

Ist eh nicht ganz konform, was du machst, da in der Zeile
Code:
.drop:hover .drop-holder {
    display: block;
}
glaube ich nicht von allen Browsern unterstützt wird.

Normal werden solche Sachen mit Javascript umgesetzt, mit einfachen CSS wirst du an der Stelle auf der Nase landen
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 20:51
Dropdown menu mit Hover-Images pbs2h8 CSS 0 10.09.2009 15:46
CSS Navigation - Problem mit IE6 pcklinik CSS 4 18.09.2007 13:04
Darstellungsproblem CSS Navigation im IE7 pcklinik CSS 7 09.09.2007 18:25
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 15:40


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:24 Uhr.