jQuery Script Generator

Use the tool below to familiarize yourself with the jQuery syntax.

Select what would you like to do.

I want to...

When...

And I'll be adding this to...



    
<script>
function dmf_custom_jquery() {?>
<script>
// Run after document has loaded...
jQuery(document).ready(function($){
  // Do something on hover...
  $('#target').hover(function(){
  // Do something on click...
  $('#target').click(function(){
  // Do something on double click...
  $('#target').dblclick(function(){
  // Do something on mouse enter...
  $('#target').mouseenter(function(){
  // Do something on mouse leave...
  $('#target').mouseleave(function(){
  // Do something on waypoint...
  $('#target').waypoint(function(){
  $(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 500) { // If user scrolls down 500px...

    $('#something').hide();
    $('#something').show();
    $('#something').css({"color": "#000", "font-size": "20px"});
    $('#something').addClass("firstclass secondclass");
    $('#something').removeClass('classtoremove');
    $('#something').toggleClass('classtotoggle');
    $("New Element!
 ").insertAfter(".classofexistingelement");
    $("New Element!
 ").insertBefore(".classofexistingelement");
    $("New Element!
 ").prepend(".classofexistingelement");
    $("New Element!
 ").append(".classofexistingelement");
    $('#target').fadeIn(5000);
    $('#target').fadeOut(5000);
    $('#target').animate({'height':'500px'});

  }
  });
  }, {offset: '50%'});
});
</script>
</script>
<?php
}
add_action( 'wp_footer', 'dmf_custom_jquery');