jQuery not working

  • Famous

    (@famous)


    12 years, 7 months ago

    So I can get the below to work on a normal html page, but when I put the CSS in the style.css and place the div in the php file and place the script in the header below the <?php wp_head(); ?> it just doesn’t work. The CSS & the divs work, however the script will not work. Any clues?

    Thanks

    <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<style>
.menuShare {
  background-color: #e5e5e5;
  position: absolute;
  padding: 20px 10px;
  top:25px;
  margin-left: -100px; /* hide it */
}

#showmenu{background:red;opacity:.12;border-radius:25px;width:50px;height:50px;display:block;}
#showmenu:hover{opacity:1;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
jQuery(document).ready(function($) {
var min = "-100px", // remember to set in css the same value
    max = "0px";

$(function() {

  $("#showmenu").click(function() {

    if($(".menuShare").css("marginLeft") == min)
      $(".menuShare").animate({ marginLeft: max });
    else
      $(".menuShare").animate({ marginLeft: min });

  });

});
});
</script>
</head>

<body>
  <a href="#" id="showmenu"></a>
  <div class="menuShare">
  </div>
</body>
</html>
Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘jQuery not working’ is closed to new replies.