The jQuery Function Generator
Welcome to the The jQuery Function Generator: A free tool for Divi Space Students. By using this tool, you can be confident that the structure and syntax of your jQuery is correct and can concentrate on getting stuff done. As you familiarise yourselves with jQuery, you’ll find yourself needing this less and less. Until then, happy coding 🙂
What would you like to do?
I want to...
When...
I'll be adding this to...
<!--Add to Integrations Tab or Code Module-->
<script>
function dsl_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').show();
    $('#something').css({"color": "#000", "font-size": "20px"});
    $('#something').addClass("firstclass secondclass");
    $('#something').removeClass('classtoremove');
    $('#something').toggleClass('classtotoggle');
    $("<p>New Element!</p>").insertAfter(".classofexistingelement");
    $("<p>New Element!</p>").insertBefore(".classofexistingelement");
    $("<p>New Element!</p>").prepend(".classofexistingelement");
    $("<p>New Element!</p>").append(".classofexistingelement");
    $('#target').fadeIn(5000);
    $('#target').fadeOut(5000);
    $('#target').animate({'height':'500px'});
  }
  });
  }, {offset: '50%'});
});
</script>
</script>
<?php
}
add_action( 'wp_footer', 'dsl_custom_jquery');