Hi, i don't why my jquery doesn't work


#1


html


<head>
  <meta charset="utf-8">

  <title>The HTML5 Herald</title>
  <meta name="description" content="The HTML5 Herald">
  <meta name="author" content="SitePoint">
  <link rel="stylesheet" type="text/css" href="css/max2000.css" media="screen and (max-device-width: 2000px)"/>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script type="text/javascript" href="js/jquery.js"></script>
</head>
  <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>

<body>
     <video src="img/la-tour-de-la-terreur-parc-walt-disney-studios_bon.mp4"autoplay loop muted id="bgvid">
        <source src="la-tour-de-la-terreur-parc-walt-disney-studios_bon.mp4" type="video/mp4">
    </video>

    <img src="img/logo.png "class="img-responsive " id="disney_logo">
  
  <div class="menu">
    <ul>
      <div class="anim">
      <li id="btn_1">
        <a href="#"><p>Histoire de l'attraction</p></a>
      </li>
      <li id="btn_1">
        <a href="#"><p>actualités</p></a>
      </li>
      <li id="btn_1">
        <a href=""><p>Galerie photo</p></a>
      </li>
      <li id="btn_1"><p>Vidéos</p></li>
      <li id="btn_1"><p>Nous contacter</p></li>
      </div>
    </ul>
  </div>
</body>
</html>

my jquery


$(document).ready(function(){
	$(".anim").hover(function(){
		$(this).animate(
			{"height:180px;width:180px"},
			"fast"
			);
	});
});


#2

Braces indicates an object definition. So you should pass object to the animate method.

$(document).ready(function() {
    $(".anim").hover(function() {
        $(this).animate({
                height: "180px",
                width: "180px"
            },
            "fast"
        );
    });
});

#3

Your code doenst work... My link in my html head might be wrong no?


#4

jQuery link is correct.

Here is a quick proof that this code works (with jQuery imported from exactly the same source) -> https://jsfiddle.net/factoradic/hurfu2fk/.

Post your whole code and we will help you.


#5

http://www.filedropper.com/disney2

everything is here


#6

i would like a buton grow while the cursor is hover


#7

Ok, now I see everything clearly.

Problems:

  1. to import a script use src attribute, not href;
  2. there are two </head> tags;
  3. id should be unique, to add the same style to many elements use class;
  4. you don't really want to animate .anim (container), you want to animate buttons, so you have to select them;
  5. is Histoire de l'attraction really a paragraph of text? :slight_smile:

To animate child elements you can use a child selector, example here -> https://jsfiddle.net/factoradic/hurfu2fk/2/

Before animating something you have to decide what elements do you want to animate and you have to select exactly these elements.