Witam korzystałem z tego
SkryptuWstawiłem wszystko co jest napisane w moja stronę i wszystko prawie działa tylko się nie wysuwa (IMG:
style_emoticons/default/sad.gif)
index.php
<script type="text/javascript">
$(document).ready(function(){
$('#login-toggle').click(function() {
$('#login-content').slideToggle(300, function() {
$("#login-toggle p").toggle();
});
});
});
</script>
</head>
<body>
<div id="naglowek">
<?php include('tpl/naglowek.php') ?>
</div>
<!– Wysuwany panel logowania jQuery START–>
<div id="login">
<div id="login-slide">
<div id="login-content">
<form action="/" method="post">
<input type="text" class="field" name="login" value="Nazwa użytkownika…" onfocus="if (this.value == 'Nazwa użytkownika…') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Nazwa użytkownika…';}" />
<input type="password" class="field" name="haslo" />
<input type="submit" class="submit" name="submit" value="Zaloguj mnie" />
</form>
<div class="linki">
<a href="#">Zapomniałeś hasła?</a> | <strong><a href="#">Zarejestruj się</a></strong>
</div>
</div>
</div>
<div id="login-toggle">
<p>Zaloguj się</p>
<p style="display: none;"><img class="close" src="img/close.png" alt="" />Ukryj panel</p>
</div>
</div>
<!– Wysuwany panel logowania jQuery KONIEC–>
A tak css
}
#logo a {color:#dd9c04; text-decoration:none;}
#logo a:hover {color:#d9c900; text-decoration:none; border-bottom:0px;}
.like {
display:block;
float:left;
padding-top:24px;
padding-left:20px;
}
.slogan {
display:block;
float:right;
padding-top:18px;
color:#fff;
font-size:22px;
}
/* Wysuwany panel logowania jQuery START*/
#login {
width: 100%;
top: 0;
position: absolute;
z-index: 999;
margin: 0;
padding: 0;
}
#login a {
color: #ffffff;
}
#login a:hover {
color: #616161;
}
#login-slide {
width: 100%;
margin: 0 auto;
padding: 0;
background: #3b3b3b;
border-bottom: 1px solid #ffffff;
}
#login-content {
width: 600px;
height: auto;
margin: 0 auto;
padding: 13px;
display: none;
}
#login-content p {
margin: 0;
padding: 0;
}
#login-toggle {
width: 174px;
height: 41px;
background: url(../img/btn.png) no-repeat;
margin: 0 auto;
padding: 0;
z-index: 999;
text-align: center;
color: #ffffff;
text-shadow: 1px 1px 1px #a20b1b;
line-height: 37px;
font-weight: bold;
cursor: pointer;
display: block;
text-decoration: none;
}
#login-toggle:hover {
color: #41070d;
text-shadow: 1px 1px 0px #ee4557;
}
#login-toggle p {
margin: 0;
padding: 0;
}
.field {
width: 200px;
border: solid 1px #303030;
float: left;
margin: 0px 6px 0px 0px;
padding: 9px 13px;
background: #ffffff;
color: #343434;
background: -webkit-gradient(linear, left top, left 25, from(#ffffff), color-stop(4%, #eeeeee), to(#ffffff));
background: -moz-linear-gradient(top, #ffffff, #eeeeee 1px, #ffffff 25px);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
Ktoś wie co może byc nie tak ? (IMG:
style_emoticons/default/ohmy.gif)
[JavaScript] Wysuwany Panel Logowania
