Light theme with button
Light theme with button, contact info and social media
Dark theme with two menus, search and sales banner
Light theme with button, social media and search
Light theme with two buttons, social media, search and contact info
Divi elegant themes menu clone
Light theme with popups and reordering
Dark theme with floating fixed navigation
Dark theme with bottom fixed menu button
Mobile layouts
Regular Section Layout
Regular Section Layout
Regular Section Video Container
Two section video layout
Inline row blurb layout
Responsive Horizontal to Vertical Timeline
Popup overlays with reusable code
Regular Section Mobile Gallery
Mobile Object Layout
Image Switcher Tabs
3 Section Layout Image Gallery
Fullwidth Slider With Light Box
Mobile Parallax With Clickable Button
Mobile Parallax Background
A Simple Mobile Adapted Call to Action Hero Layout
Online Doctor | Call To Action Layout
Two section mobile adapted product layout
Product Layout with Details and Pricing
Advanced 3 Section Product Layout
Two Section List Items
Use the tool below to familiarize yourself with the jQuery syntax.
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');