WP-Mix

A fresh mix of code snippets and tutorials

Category Archive: JavaScript

Posts about JavaScript

Page 1 of 5

Vanilla JavaScript: Focus Input on Page Load

Super quick tutorial today. How to focus the user on any input when the page loads. For example, when you visit the WordPress Login Page, the “Username” field is focused automatically. This technique is very simple and works on any input or element that supports a focused state.

WordPress: Simple Image Upload with jQuery

Some of my free WordPress plugins enable users to select and upload files from their local machine. The uploaded images are handled by WordPress and added to the Media Library. The technique is very basic and easy to implement, requiring only a few snippets added to your WordPress site.

Set Timeout and Redirect with JavaScript

Hello again! This WP-Mix tutorial shows how to set a timeout and redirect to any URL using vanilla JavaScript. It’s one line of code easy peasy.

jQuery: Remove parent element containing empty span

This tutorial explains how to remove the parent of an element that contains an empty <span></span> (or any empty element). First I’ll explain where it might be useful, and then share the magical code to make it happen.

Add Defer and Async to WordPress Enqueued Scripts

When adding JavaScript in WordPress, it sometimes is necessary to add attributes such as async and defer to the <script></script> tag. Here is a technique to do it with any WordPress version 4.1 and better.

JavaScript & jQuery: Add Style to Fragment Identifier

It’s easy to style a <div></div> by targeting its ID. But what if you only want to add style when a specific fragment identifier is targeted via the URL? So for example, your page at /about/ has a table with all the data. When visitors arrive directly at /about/, no extra styles are added. But […]

jQuery prevent widows

While redesigning DigWP.com, I was experimenting with different layouts for the comments section. In one of those layouts, I needed to prevent widows in the comment text (when it comes to cleanly displayed text, widows are the worst). So after some playing, I came up with a couple of jQuery snippets that work great. Here […]

jQuery Scroll to Target with Offset

This tutorial shows how to create “scroll-to” links with jQuery. For example, if you want to add a link on your page that smoothly scrolls the user to a specific location, add the following code snippet to your JavaScript file.

jQuery Toggle Password Field

Just a quick jQuery code snippet to toggle a password field. I used this technique for the license field of my premium WordPress firewall plugin, BBQ Pro. Sharing it here for reference and just in case I need to use it again.

Dead Simple Tooltips

Finding a decent tooltip script takes a lot of work, searching, testing, fiddling. Often, it’s much quicker and easier to simply roll your own, maybe starting from something very basic and simple. The problem is that finding a super simple starting point for tooltips is next to impossible; the few scripts that are available aren’t […]

jQuery Open Links in New Tab

Over the years, I’ve collected various JavaScript techniques for opening external links in their own tab. Here they are, all in one convenient post..

JavaScript redirect to URL on select

JavaScript and jQuery techniques for redirecting to the specified URL when the user makes a selection.