tobm_knows_best
Erfahrenes Mitglied
Hey zusammen, ich habe folgenden Effekt, welcher ein wenig *lahmt* - kann mir villeicht jemand dazu sagen, wie ich denn die Geschwindigkeit beeinflussen kann...?
Ich hätte gerne, dass der *scharze Balken* der erscheint einen Tick fixer ein und ausblendet...
Hier mal der Code:
Vielen Dank schon einmal im Voraus - sollte mir jemand helfen können
Merci!
Ich hätte gerne, dass der *scharze Balken* der erscheint einen Tick fixer ein und ausblendet...
Hier mal der Code:
HTML:
<div class="div_leistungen" id="div_leistungen"><span class="fett_blau_14px">Leistungen</span><span class="div_aktuelles">» Alles auf einem Blick...<br />
<br />
<style type="text/css">
/* <![CDATA[ */
.image-wrapper {
border:3px solid #EEE;
position:relative;
width:305px;
height:150px;
overflow:hidden;
}
.image-wrapper > img {
display:block;
}
.image-wrapper {
box-shadow:0px 0px 5px rgba(0, 0, 0, .7);
-moz-box-shadow:0px 0px 5px rgba(0, 0, 0, .7);
-webkit-box-shadow:0px 0px 5px rgba(0, 0, 0, .7);
}
.image-wrapper > .image-details {
margin:0;
position:absolute;
left:0px;
right:0px;
bottom:0px;
height:50px;
line-height:50px;
background:#000;
color:#fff;
opacity:.7;
}
/* ]]> */
</style>
</head>
<body>
<div class="image-wrapper">
<img src="http://www.mediengrafik-online.de/Test/pics/leistungen_305x150px.png" alt="" />
<p class="image-details">
*» <a href="#">Erfahren Sie mehr</a>
</p>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
$(function() {
$('.image-details').css('bottom', '-50px').parent().hover(function() {
$(this).find('.image-details').animate({'bottom': '0px'}, 'fast');
}, function() {
$(this).find('.image-details').animate({'bottom': '-50px'}, 'fast');
});
});
/* ]]> */
</script>
</span></div>
Vielen Dank schon einmal im Voraus - sollte mir jemand helfen können
Merci!