Hallo,
ich möchte ein Login Bereich per Mouse-over (Tooltip) erscheinen lassen.
Das Funktioniert auch ohne Probleme, allerdings verschwindet es sobald ich weggehe, daher würde ich das gerne 5sek geöffnet lassen das man mit der Maus noch zum "Login" kommt und Daten eintragen kann.
[src=html4strict]
<style>
/* Tooltip container */
.tooltip {
position: relative;
display: inline-block;
border-bottom: 0px dotted black; /* If you want dots under the hoverable text */
}
/* Tooltip text */
.tooltip .tooltiptext {
visibility: hidden;
width: 300px;
background-color: grey;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
/* Position the tooltip text - see examples below! */
position: absolute;
z-index: 1;
}
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
visibility: visible;
}
</style>
<div class="tooltip">Mein Account
<span class="tooltiptext">
<link rel="stylesheet" type="text/css" href="data/style_login.css?v=35" media="all" />
<script type="text/javascript" src="data/jquery-1.7.2.min.js?v=32"></script>
<script type="text/javascript" src="data/login.js?v=32"></script>
<header>
<nav class="page">
<ul class="topheader_right" style='width:10%'>
</ul>
<div class="quicklogin_header">
<form action="https://domain.com/account/user/login/" method="post" id="login-form">
<input name="form_key" type="hidden" value="Eog9Iesl00gOL4Qz" />
<h3 class="login-register-form_title">
<img src="domain.com" />
Bereits Registriert </h3>
<fieldset>
<div class="text input-box">
<label for="login[username]">EMAIL</label>
<input type="text" name="login[username]" value="" id="email" class="input-text required-entry validate-email" title="Email Address" placeholder="email@beispiel.de" />
</div>
<div class="text input-box">
<label for="email">Passwort</label>
<input type="password" name="login[password]" value="" id="passwd" class="input-text required-entry validate-password" placeholder="Dein Passwort" />
</div>
<div class="forgot-password login-form">
<a href="domain.com/customer/account/forgotpassword/" rel="nofollow">Passwort vergessen ?</a>
</div>
<div class="login-form checkbox">
<input type="checkbox" name="persistent_remember_me" class="checkbox" id="remember_me1KQxqsKpbS" checked="checked" title="Remember Me" />
<label for="remember_me1KQxqsKpbS">Angemeldet bleiben</label>
</div>
<div class="submit login-form">
<input id="do_customer_login" type="submit" class="button" value="Login" />
</div>
<input type="hidden" name="current_url" value="domain.com/customer/account/create/" />
<input id="redirect_after" type="hidden" name="redirect_ok" value="domain.com/customer/account/create/" />
</fieldset>
</form>
<script type="text/javascript">
//<![CDATA[
var dataForm = new VarienForm('login-form', true);
//]]>
</script>
<div class="new-users">
<h3 class="login-register-form_title">
<img src="domain.com" />
Bisher noch kein Account? </h3>
<p>Melde dich einfach an ...</p>
<div class="submit login-form">
<input type="button" class="button" onclick="window.location='domain.com/customer/account/create/';" value="Account Erstellen" />
</div>
</div>
</div>
</span>
</div>
[/src]
Cr3y
ich möchte ein Login Bereich per Mouse-over (Tooltip) erscheinen lassen.
Das Funktioniert auch ohne Probleme, allerdings verschwindet es sobald ich weggehe, daher würde ich das gerne 5sek geöffnet lassen das man mit der Maus noch zum "Login" kommt und Daten eintragen kann.
[src=html4strict]
<style>
/* Tooltip container */
.tooltip {
position: relative;
display: inline-block;
border-bottom: 0px dotted black; /* If you want dots under the hoverable text */
}
/* Tooltip text */
.tooltip .tooltiptext {
visibility: hidden;
width: 300px;
background-color: grey;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
/* Position the tooltip text - see examples below! */
position: absolute;
z-index: 1;
}
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
visibility: visible;
}
</style>
<div class="tooltip">Mein Account
<span class="tooltiptext">
<link rel="stylesheet" type="text/css" href="data/style_login.css?v=35" media="all" />
<script type="text/javascript" src="data/jquery-1.7.2.min.js?v=32"></script>
<script type="text/javascript" src="data/login.js?v=32"></script>
<header>
<nav class="page">
<ul class="topheader_right" style='width:10%'>
</ul>
<div class="quicklogin_header">
<form action="https://domain.com/account/user/login/" method="post" id="login-form">
<input name="form_key" type="hidden" value="Eog9Iesl00gOL4Qz" />
<h3 class="login-register-form_title">
<img src="domain.com" />
Bereits Registriert </h3>
<fieldset>
<div class="text input-box">
<label for="login[username]">EMAIL</label>
<input type="text" name="login[username]" value="" id="email" class="input-text required-entry validate-email" title="Email Address" placeholder="email@beispiel.de" />
</div>
<div class="text input-box">
<label for="email">Passwort</label>
<input type="password" name="login[password]" value="" id="passwd" class="input-text required-entry validate-password" placeholder="Dein Passwort" />
</div>
<div class="forgot-password login-form">
<a href="domain.com/customer/account/forgotpassword/" rel="nofollow">Passwort vergessen ?</a>
</div>
<div class="login-form checkbox">
<input type="checkbox" name="persistent_remember_me" class="checkbox" id="remember_me1KQxqsKpbS" checked="checked" title="Remember Me" />
<label for="remember_me1KQxqsKpbS">Angemeldet bleiben</label>
</div>
<div class="submit login-form">
<input id="do_customer_login" type="submit" class="button" value="Login" />
</div>
<input type="hidden" name="current_url" value="domain.com/customer/account/create/" />
<input id="redirect_after" type="hidden" name="redirect_ok" value="domain.com/customer/account/create/" />
</fieldset>
</form>
<script type="text/javascript">
//<![CDATA[
var dataForm = new VarienForm('login-form', true);
//]]>
</script>
<div class="new-users">
<h3 class="login-register-form_title">
<img src="domain.com" />
Bisher noch kein Account? </h3>
<p>Melde dich einfach an ...</p>
<div class="submit login-form">
<input type="button" class="button" onclick="window.location='domain.com/customer/account/create/';" value="Account Erstellen" />
</div>
</div>
</div>
</span>
</div>
[/src]
Cr3y
