dsNDesign
Erfahrenes Mitglied
Hei,
ich bin mir nicht sicher, ob dies in den CSS oder Javascript-Bereich gehört. Hat von beidem etwas.
Mein Anliegen: http://web34.server30.campusspeicher.de/Test/
Ich denke, man sieht schon recht gut, was der Fehler ist. Wenn man mit der Maus über eines der Icons fährt, verbreitert sich der Container. Jedoch wird während der Animation der Rest in eine neue Zeile verschoben. Dies soll jedoch nicht so sein. Der Rest soll einfach zur Seite "geschoben" werden.
Hier mal der Code von 2 Icons:
CSS:
HTML:
und der Java (jQuery) Teil:
Weiß jemand einen Rat, wie ich dies lösen könnte?
Gruß
ich bin mir nicht sicher, ob dies in den CSS oder Javascript-Bereich gehört. Hat von beidem etwas.
Mein Anliegen: http://web34.server30.campusspeicher.de/Test/
Ich denke, man sieht schon recht gut, was der Fehler ist. Wenn man mit der Maus über eines der Icons fährt, verbreitert sich der Container. Jedoch wird während der Animation der Rest in eine neue Zeile verschoben. Dies soll jedoch nicht so sein. Der Rest soll einfach zur Seite "geschoben" werden.
Hier mal der Code von 2 Icons:
CSS:
Code:
.navi_news {
width:50px;
overflow:hidden;
display:inline-block;
}
.navi_bands {
width:32px;
overflow:hidden;
display:inline-block;
}
.navi_trenn {
background-image:url(image/navi_t.png);
background-position:center;
background-repeat:no-repeat;
width:81px;
height:45px;
display:inline-block;
}
HTML:
HTML:
<div class="navi_news"><img src="image/news.png" alt="News" /></div><div class="navi_trenn"></div><div class="navi_bands"><img src="image/bands.png" alt="Bands" /></div>
und der Java (jQuery) Teil:
PHP:
<script type="text/javascript">
$(".navi_news").hover(function() {
var breite = $(".navi_news").css("width");
$(this).animate({width: "96px"}, 300);
},
function() {
$(this).animate({width: "50px"}, 300);
}
);
$(".navi_bands").hover(function() {
var breite = $(".navi_bands").css("width");
$(this).animate({width: "83px"}, 300);
},
function() {
$(this).animate({width: "32px"}, 300);
}
);
</script>
Weiß jemand einen Rat, wie ich dies lösen könnte?
Gruß
Zuletzt bearbeitet: