Moin,

ich möchte gern meinen Blog auf jquerry umstellen (vorher mootools). Und eigentlich sehen die Funktionen dazu auch recht simpel aus. Nur irgendwie will es nicht klappen! Ich hab mal ein Beispiel geschrieben, was klappen sollte. Er soll das "Fenster" verschwinden lassen. Wo liegt der Fehler ?

html
HTML-Code:
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/functions.js"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<a href="#" id="ToggleSidebar" title="ein-/ausblenden">Klick mich</a>
<div class="beispiel">
<b class="top">
<b class="r1"></b><b class="r2"></b>
<b class="r3"></b><b class="r4"></b>
</b>
<h1>Runde Ecken</h1>
<p>Wenig Code, viel Ergebnis</p>
<b class="bottom">
<b class="r4"></b><b class="r3"></b>
<b class="r2"></b><b class="r1"></b>
</b>
</div>
js
Code:
$("a#ToggleSidebar").click().toggle(function() {
    $('div.beispiel').animate({
        width: 'hide',
        opacity: 'hide'
    }, 'slow');
}, function() {
    $('div.beispiel').animate({
        width: 'show',
        opacity: 'show'
    }, 'slow');
});
css
Code:
body { background: #212121; }
.beispiel { width: 800px; position: fixed; top: 70px; left: 100px; background: #323232;}
.beispiel .top, .beispiel .bottom{display:block;background: #212121;}
.beispiel .top b, .beispiel .bottom b
{
  display:block;height: 1px; overflow: hidden; background: #323232; 
}
.beispiel .r1{margin: 0 5px;}
.beispiel .r2{margin: 0 3px;}
.beispiel .r3{margin: 0 2px;}
.beispiel .top .r4, .beispiel .bottom .r4{margin: 0 1px;height: 2px;}
Beispiel
Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!