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');

WELCOME TO DIVIMOBIFIRST

DIVI COMPLETE LAYOUT SCHEME

HEADERS AND FOOTERS

SECTION LAYOUT

IMAGE LAYOUTS

PRICE TABLES

PRODUCT LAYOUTS

TAB LAYOUTS

SLIDERS

Regular & Specialty Section

Mobile Header 1

Mobile Header 2

Mobile Header 3

Mobile Header 4

Mobile Header 5

Mobile Header 6

Mobile Footer 1

Mobile Footer 2

Mobile Footer 3

Regular Mobile Objects

Double Rows

Circle Timers

Mobile Video

Mobile Video Container

Blurbs with a Difference

Responsive Timeline

Fullpage Popup Overlays

Mobile Gallery

Picture Tabs

Image Switcher

Image Gallery

Fullwidth Gallery Slider

Clickable Background

Multiple CSS Parallax

Pricing Table 1

Pricing Table 2

Pricing Table 3

Pricing Table 4

Pricing Table 5

Business Hero Layout

Call to Action Layout

Simple Product Layout

Advanced Product Layouts

3 Section Product Layout

List Items

Tabbed Pages Download

Tab Picture Showcase

Mobile Picture Tabs

ET Video Switcher Clone

Horizontal Swipe Cards

Image Slider

Auto Scroll Slider

Horizontal Module Slider

Team Showcase

Hero Page

Tabbed Pages

Swipe Cards

Picture Tabs

Simple Product Layout

Mobile Product Layout

Custom Image Gallery

Image Galley Slider

Fullwidth Gallery Slider

Multiple CSS Parallax

PRICING

jQuery Script Generator

Floating Modules

Zoom in Effect

Plugin Tutorial

CONTACT US

YOUR CART

Back to top

jQuery Script Generator

Select what would you like to do.

Introducing Our Latest Mobile Theme!

You have Successfully Subscribed!