• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

JQuery einbinden

dfb001

Neues Mitglied
Hallo,
ich möchte gerne diese JQuery Funktion bei meiner site einbauen: http://blurjs.com/?bg=1
Was muss ich machen? bin im Gebiet JQuery noch ein absoluter Neuling. Ich würde mich über Hilfe freuen. Ich hab den Body mit css ein background-image gegeben und wollte jetzt einen article erstellen der als Hintergrund so milchig aussieht.


Dannke
 
Werbung:
Es ist natürlich sehr schwer, die beiden Wörter 'jquery einbinden' bei Google einzugeben. In so komplizierten Fällen können wir leider auch nicht weiterhelfen.
 
Ich habe es selber schon versucht nur irgendwie funktioniert es nicht:( Ich habe es schon den halben Tag gegooglet.
 
Werbung:
Der HTML Teil :

<div id="Mitte">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
$(".fenster").blurjs({
source: "#hintergrund",
radius: 7,
overlay: "rgba(255, 255, 255, 0.5)"
}
</script>

</div>

und der css teil :
body {
width: 100%;
height: 100%;
margin: 25px auto;
background-image: url('../images/Zug.jpg');
}

#Mitte {
width: 1000px;
height: 800px;
text-align: center;
background-color: white;
margin-bottom: 2px;
margin: auto;
border-radius: 10px;

}

der jquery teil funktioniert nicht, also der Bereich wird nicht 'milchig'.
 
der jquery teil funktioniert nicht, also der Bereich wird nicht 'milchig'.

Kann er auch nicht. Du hast zwar jQuery eingebunden, aber nicht das Plugin, und außerdem existiert in deinem geposteten HTML kein Element mit der CSS-Klasse .fenster, auf welche die Funktion aufgerufen wird.

Außerdem:
- Verwende möglichst eine aktuellere jQuery-Version als 1.7.1
- Öffnende und schließende <script>-Tags gehören sowohl für die eingebunden Bibliotheken als auch den Code.
- JavaScript gehört nicht mitten in den Div-Container sondern vor das schließende </body>.
 
Werbung:
ich habe jetzt anstatt .Fenster #Mitte.
Das Script habe ich an das Ende vom Body geschrieben.

Was Ich jetzt noch nicht verstehe ist was du mit dem einbinden des Plugins meinst und deinen zweiten Punkt mit schließenden </script> Tags. Ich wäre dir sehr dankbar wenn du mir hilfst.
 
Mit dem schließenden Tag meint er:
HTML:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$("#Mitte").blurjs({
source: "#hintergrund",
radius: 7,
overlay: "rgba(255, 255, 255, 0.5)"
}
</script>

Und so wie du jetzt JQuery eingebunden hast musst du nochmals in einer Zeile auch das Plugin selbst laden:

HTML:
<script type="text/javascript" src="http://blurjs.com/blur.js"></script>

P.S.: Im Quelltext der Beispielseite von blurjs kannst du doch alles abschauen...
 
Zuletzt bearbeitet:
Werbung:
Das ist jetzt mein HTML Code

HTML:
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link href="../Styles/Startseite.css" type="text/css" rel="stylesheet">
    <title></title>
</head>
<body>
        <div id="Mitte">
           

        </div>
        
   
   <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js">
       $(".Mitte").blurjs({
           source: "#Mitte",
           radius: 7,
           overlay: "rgba(255, 255, 255, 0.8)"
       }
                </script>
</body>
</html>

und das mein CSS

body {
width: 100%;
height: 100%;
margin: 25px auto;
background-image: url('../images/Zug.jpg');
}

#Mitte {
width: 1000px;
height: 800px;
text-align: center;
background-color: white;
margin-bottom: 2px;
margin: auto;
border-radius: 10px;

}

brauch ich außerdem noch etwas? Eine Datei oder so?
 
Zurück
Oben