jQuery - backgound-image Problem

waswiewo

waswiewo

Erfahrenes Mitglied
Hallo,

ich habe ein Problemchen. Ich möchte ganz simpel das Hintergrundbild einer DIV-Box bei MouseOver & -Out ändern, habe dazu auch Tutorials und Workouts gelesen.

Ich habe jetzt folgenden Code:

Code: 
$('#pic')

.mouseover(function(){
    
    $(this)
    
    .delay(500)
    .queue(function(){
        
        $(this)
        
            .css("background-image","url(/pico.png)")
            .dequeue();
            
    });
 
})

.mouseout(function(){
    
    $(this)
    
    .delay(100)
    .queue(function(){
        
        $(this)
        
            .css("background-image","url(/pic.png)")
            .dequeue();
            
    });
 
})

Doch zu sehen ist gar nichts. Der Editor zeigt auch keinen Fehler an. Beim Testen (xampp-Server) ist im Browser auch nichts zu sehen. Auch keine W3C-Fehler.

Woran kann es liegen?

Ich habe die .js-Datei im Ordner "js" und die Bilder im ordner "img". beide Ordner sind im Mainordner mit der index.php.

Bereits getestet (jeweils mit "...", '...' und ohne):

Code: 
url(pic.png)
url(/pic.png)
url(../pic.png)
url(../img/pic.png)
url(img/pic.png)
url(/img/pic.png)
 
Zuletzt bearbeitet:
Und wie soll ich das herausfinden? Ich habe die css-Dateien, die js-Dateien, die Bilder, usw. alle in verschiedene Ordner ausgelagert. Das habe ich immer so gemacht. Nur kommt jQuery damit anscheinend nicht klar.

habe bereits den Direktlink hingeschrieben.... nichts.

Auch wenn ich...

Code: 
.css("background-image","none")

...hinschreibe, passiert nichts.

Die .js-Datei habe ich einfach im <head> eingebunden. Muss ich den Browser nochmal speziell darauf hinweisen, dass er beim Hover die .js-Datei durchlaufen lassen soll? Eigentlich nicht, oder?

Hier der html-Code:

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	
<title>Uploader v1</title>

<link rel="stylesheet" type="text/css" href="css/style.css" />

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="js/jquery-function.js"></script>

</head>

<body>

  <div id="inhalt">
      
      <a href="upload.php" title="Startseite"><img id="logo" src="img/logo.png" alt="" /></a>
      <div id="pic"></div>
      <div id="vid"></div>
      <div id="arch"></div>
      <div id="dat"></div>

    <form action="upload_lo.php" method="post" enctype="multipart/form-data">

	<label for="file">Bitte eine Datei ausw&auml;hlen:</label>
	<input id="file" type="file" name="datei" style="color: #e9a210" /><br /><br />

	<input type="submit" value="Hochladen" style="width: 550px;" /> 

    </form>

  </div>

</body>

</html>
 
Zuletzt bearbeitet:
Oh oh oh...

document.ready war das Problem.... man man man

Ich hatte es gestern noch drin stehen gehabt. Dämlich, dämlich...

Danke für den Denkanstoß!
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück