1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  1. HTML - Webmaster Forum
  2. Programmierung - Entwickler Forum
  3. PHP Forum - Apache - CGI - Perl - JavaScript und Co.

jQuery Plugin?

  • #matthias
  • 19. Juli 2010 um 18:48
  • #matthias
    Samurai
    Beiträge
    200
    • 19. Juli 2010 um 18:48
    • #1

    Hallo,

    ich bin dabei mich ein wenig in Javascript, ins Besondere jQuery, einzuarbeiten.
    Jetzt habe ich gelesen das man für viele Animation das easing-Plugin benötige.
    Diese habe ich mir runter geladen und in einen Ordner gespeichert.
    Nun ist meine Frage wie ich es einbinden kann? Bis jetzt habe ich es so versucht:

    PHP
    <script type="text/javascript" src="Scripte/easing.js" />


    Also wie zusehen ist heißt das Script "easing.js" und liegt in dem selben Verzeichnis wie auch die html Datei, in einen Ordner "Scripte".

    MFG Matthias

    [Blockierte Grafik: http://img361.imageshack.us/img361/6978/19980.jpg]

    HTML


    [Blockierte Grafik: http://img30.imageshack.us/img30/25/27657.gif]

  • Bandit
    Gast
    • 19. Juli 2010 um 19:06
    • #2

    Und dein Frage lautet wie?

    Ich wüsste nicht, was daran falsch sein sollte.

  • #matthias
    Samurai
    Beiträge
    200
    • 19. Juli 2010 um 19:14
    • #3

    Eigentlich wollte ich nur wissen ob ich es so richtig eingebunden habe.
    Ich habe in einer html Datei ein Script welches nicht das tut was es soll.

    PHP
    <!DOCTYPE html>
    <html lang="de">
    <head>
    <meta charset="utf-8" />
    	<title>
    		jQuery - Animation 1
    	</title>  
    <style type="text/css" media="screen">
    	#Fade {
    		width: 300px;
    		height: 300px;
    		background: blue;	
    	}
    </style>
    </head>
    <body>
    	<div class="fade" id="Fade"></div>    		
    	<a id="Verkleinern" href="#" >Div verkleinern!</a>
    
    <script type="text/javascript" src="Scripte/jquery.js"/>
    <script type="text/javascript" src="Scripte/easing.js" />
    <script type="text/javascript" >
    $(document).ready(function(){
    	$("#Ausblenden").click(function(){
    		$("#Fade").animate({
    			width: "-=40px",
    			height: "-=40px"		
    		}, 600);
    
    });
    </script>
    </body>
    </html>
    Alles anzeigen

    MFG Matthias

    [Blockierte Grafik: http://img361.imageshack.us/img361/6978/19980.jpg]

    HTML


    [Blockierte Grafik: http://img30.imageshack.us/img30/25/27657.gif]

  • Bandit
    Gast
    • 19. Juli 2010 um 19:38
    • #4
    HTML
    <script type="text/javascript" src="Scripte/jquery.js"/> 
    <script type="text/javascript" src="Scripte/easing.js" /> 
    <script type="text/javascript" > 
    $(document).ready(function(){ 
        $("#Ausblenden").click(function(){ 
            $("#Fade").animate({ 
                width: "-=40px", 
                height: "-=40px"         
            }, 600); 
    
    }); 
    </script>
    Alles anzeigen


    Das gehört in den Head-Bereich

  • #matthias
    Samurai
    Beiträge
    200
    • 19. Juli 2010 um 20:18
    • #5

    Danke.
    Ich habe es jetzt umgeändert:

    PHP
    <!DOCTYPE html> 
    <html lang="de"> 
    <head> 
    <meta charset="utf-8" /> 
        <title> 
            jQuery - Animation 1 
        </title>   
    
    <script type="text/javascript" src="Scripte/jquery.js"/> 
    <script type="text/javascript" src="Scripte/easing.js" /> 
    <script type="text/javascript" > 
    $(document).ready(function(){ 
        $("#Verkleinern").click(function(){ 
            $("#Fade").animate({ 
                width: "-=40px", 
                height: "-=40px"         
            }, 600); 
    
    }); 
    </script> 
    <style type="text/css" media="screen"> 
        #Fade { 
            width: 300px; 
            height: 300px; 
            background: blue;     
        } 
    </style> 
    </head> 
    <body> 
        <div class="fade" id="Fade"></div>             
        <a id="Verkleinern" href="#" >Div verkleinern!</a> 
    </body> 
    </html>
    Alles anzeigen

    Es hat sich aber leider nichts verändert, das Script funktioniert immer noch nicht.

    MFG Matthias

    [Blockierte Grafik: http://img361.imageshack.us/img361/6978/19980.jpg]

    HTML


    [Blockierte Grafik: http://img30.imageshack.us/img30/25/27657.gif]

  • #matthias
    Samurai
    Beiträge
    200
    • 19. Juli 2010 um 20:37
    • #6

    Fehler gefunden!

    Es hat ein schließendes Klammern Paar gefehlt:

    PHP
    <script type="text/javascript" src="Scripte/jquery.js"/>  
    <script type="text/javascript" src="Scripte/easing.js" />  
    <script type="text/javascript" >  
    $(document).ready(function(){  
        $("#Verkleinern").click(function(){  
            $("#Fade").animate({  
                width: "-=40px",  
                height: "-=40px"          
            }, 600);  
         }); //das hat gefehlt
    });
    Alles anzeigen

    MFG Matthias

    [Blockierte Grafik: http://img361.imageshack.us/img361/6978/19980.jpg]

    HTML


    [Blockierte Grafik: http://img30.imageshack.us/img30/25/27657.gif]

Tags

  • html
  • style
  • body
  • text
  • verzeichnis
  • click
  • php
  • ordner
  • datei
  • div
  • javascript
  • script
  • utf-8
  • height
  • scripte
  • animation
  • css
  • fade
  • px
  • width
  • ready
  • head
  • js
  • plugin
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
Zitat speichern