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

Java Headtags

D

Davcom

Neues Mitglied
Hallo,

ich versuche gerade verschiedene Javascripte einzubinden. Diese scheinen sich aber im <Head> Bereich nicht zu mögen. Ich hoffe ihr könnt mir weiterhelfen.



CODE:
<link rel="stylesheet" type="text/css" href="css/main.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="java/jquery.sideswap.js"></script>

<script type='text/javascript' src='jquery/jquery-1.8.2.min.js'></script>
<link rel='stylesheet' href='jquery-colorbox/colorbox.css' type='text/css' media='screen' />
<script type='text/javascript' src='jquery-colorbox/jquery.colorbox-min.js'></script>
<link rel='stylesheet' href='../css/jquery.justifiedgallery.min.css' type='text/css' media='all' />
<script type='text/javascript' src='../js/jquery.justifiedgallery.min.js'></script>

<script type="text/javascript">
$(window).load(function()
{
$('#rotating-elements').sideswap({
navigation : false,
transition_speed : 2000,
display_time : 7000
});
});

$(document).ready(function() {

$("#startseite").click(function() {
$("#mains").animate({backgroundColor: "#87c33d"});
$("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

$("section").load("startseite.html", function() {
$("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);

});

});

});
$("#referenzen").click(function() {
$("#mains").animate({backgroundColor: "#64a03b"});

$("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

$("section").load("referenzen.html", function() {
$("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);
});

});

});

$("#uebermich").click(function() {
$("#mains").animate({backgroundColor: "#378238"});

$("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

$("section").load("uebermich.html", function() {

$("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);

});

});

});
$("#kontakt").click(function() {
$("#mains").animate({backgroundColor: "#1c7144"});

$("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

$("section").load("kontakt.html", function() {

$("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);

});

});

});
});




$(".myExample4").justifiedGallery({
'usedSuffix':'lt240',
'justifyLastRow':true,
'rowHeight':80,
'fixedHeight':false,
'lightbox':true,
'captions':false,
'margins':1
});

</script>
</head>
<body>...
...
 
Man kann nicht mehrere jQuery-Versionen gleichzeitig in eine Webseite einbinden. Nimm einzig die neueste Version würde ich pauschal raten.
 
Zwei jQuery-Versionen im Head sind schon mal schlecht, und $(window).load() gefolgt von $(document).ready() macht auch nicht wirklich Sinn.
 
Ok, danke für die Antworten. Zunächst: Ich bin noch nicht sehr vertraut mit jquery, könnt ihr mir da gute Tutorials empfehlen?
Was meint ihr mit zwei jquery Versionen? Ich denk ihr bezieht es auf:

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="java/jquery.sideswap.js"></script>
<script type='text/javascript' src='jquery/jquery-1.8.2.min.js'></script>

Ich dachte jquery und jquery-ui ist was verschiedenes. daher sehe ich gerade nicht was ich löschen muss bzw. was gleich ist.
Gruß
 
HTML: 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

und

HTML: 
<script type='text/javascript' src='jquery/jquery-1.8.2.min.js'></script>

sind 2 verschiedene jQuery-Versionen.

Und verwende bitte Code-Tags wenn Du Quellcode im Forum postest.
 
Hi,
ok ich komme dem langsam auf die Spur was ihr meint, muss aber noch einen Schritt zurück gehen.
Ich habe meine erste Seite gemacht und wollte eine Slideshow, darunter ein mit ajax laufendes menü und in einem Menüpunkt eine auf Jquery basierende Gallerie aufbauen. Soweit so gut. Es funktionierte alles einzeln eingefügt. Alles zusammen funktioniert leider nicht. (garten-curdt.de) wenn man auf referenz klickt, stirbt die colorfade des rahmens.
Dry and dirty habe ich einfach in referenzen.html diesen Kopf:
HTML: 
<head>
<script type='text/javascript' src='gallery/jquery/jquery-1.8.2.min.js'></script>
<link rel='stylesheet' href='gallery/jquery-colorbox/colorbox.css' type='text/css' media='screen' />
<script type='text/javascript' src='gallery/jquery-colorbox/jquery.colorbox-min.js'></script>
<link rel='stylesheet' href='css/jquery.justifiedgallery.min.css' type='text/css' media='all' />
<script type='text/javascript' src='js/jquery.justifiedgallery.min.js'></script>
</head>

<body>

<script type="text/javascript">
    $(".myExample1").justifiedGallery({
        'usedSuffix':'lt240', 
        'justifyLastRow':true, 
        'rowHeight':70, 
        'fixedHeight':false, 
        'lightbox':true, 
        'captions':true, 
        'margins':1
    });
</script>

<div class="myExample1" >
    <a href="gallery/photos/natursteinpflasterkreis_b.jpg" title="Natursteinpflasterkreis">
        <img alt="Natursteinpflasterkreis" src="gallery/photos/natursteinpflasterkreis_m.jpg" />
    </a> [...]

In meiner Startseite habe ich diesen Kopf:
HTML: 
<html>
    <head>
<title>Curdt Gartenbau</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<link href='http://fonts.googleapis.com/css?family=Fondamento' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Alex+Brush' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Eagle+Lake' rel='stylesheet' type='text/css'>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="java/jquery.sideswap.js"></script>

<script type="text/javascript">
$(window).load(function()
{
    $('#rotating-elements').sideswap({
        navigation : false,
        transition_speed : 2000,
        display_time : 7000
    });
});

$(document).ready(function() {

    $("#startseite").click(function() {
        $("#mains").animate({backgroundColor: "#87c33d"});
        $("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

            $("section").load("startseite.html", function() {
                            $("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);

            });

        });

    });
    $("#referenzen").click(function() {
            $("#mains").animate({backgroundColor: "#64a03b"});

            $("section").animate({opacity:"0", filter:"alpha(opacity=0)"}, 400, function() {

                $("section").load("referenzen.html", function() {
                    $("section").animate({opacity:"1", filter:"alpha(opacity=100)"}, 400);
                });

            });

        });
Wenn ich die Jqueryversion der Gallerie ändern möchte, funktioniert diese nicht mehr. Ändere ich die Version auf der Startseite funktioniert sie zwar noch, aber der Fehler tritt immernoch auf.

Stelle ich mein Problem klar dar? :shock:

Gruß
 
Dein Problem besteht darin, eine Webseite für fortgeschrittene Einsteiger bauen zu wollen, ohne die Grundlagen der von dir eingesetzten Technologien richtig verstanden zu haben.

Um nur ein paar Punkte zu nennen:
- Deiner Seite fehlt der Doctype.
- Wieso jQuery 1.9.1 rauswerfen und 1.8.3 behalten?
- Du verwendest immer noch $(window).onload() und $(document).ready() gleichzeitig.
 
Hi,
das <!doctype html> habe ich nur vergessen mit zu kopieren. Das ich noch Probleme mit jquery etc. habe, finde ich für die erste seite nicht verwunderlich.
Das Versionen Problem scheint mir einleuchtend, nur veränder ich es hoch, funktioniert die gallerie gar nicht mehr (zumindest mit der 1.10.0)
Wo finde ich lösungen? Wo kann ich sachen nachlesen?
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben