Tag Archives: javascript

Stop CloudFlare Rocketscript breaking WordPress plugin scripts

CloudFlare offers a service called Rocketscript, which compresses, concatenates, and defers any JavaScript on your web pages. On some websites, it can make a significant difference to the apparent page load time, because it waits until the web browser has loaded the page before it loads and executes scripts. Of course, that sometimes means it breaks things! Fortunately, CloudFlare offers a way to avoid that, and it’s possible to use it on your WordPress plugin scripts. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

sessionStorage with expiry time

Session storage is a very handy tool for caching content fragments retrieved via AJAX. Once we’ve pulled the content once, and stuffed it into session storage, we can access it again quickly without the overhead of a round trip to the server. But what if we want to limit the age of that content, so that it expires before it gets too stale? Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Add custom JavaScript actions to WP e-Commerce cart updates, again

I previously wrote about adding your own custom JavaScript actions to the WP e-Commerce cart update event. Of course, things change, people change, hairstyles change, interest rates fluctuate, WP e-Commerce moves goalposts, so there is a new way to do this since version 3.8.11 came out. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Stop users from submitting Gravity Forms form twice

A common problem with input forms is that users get impatient and click the submit button twice. This can lead to double (or triple, or quadruple!) form submissions, which can really mess things up (especially if you’ve added a billing step to your form!) Stopping it can be surprisingly complex, but here’s a simple piece of browser script that will prevent most users from making multiple submissions with Gravity Forms. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Using jQuery’s ajaxSend event to change an AJAX request

Customisation of web software sometimes requires that you get it to pass around some additional information whenever it makes a page request. Often, putting that information into a cookie isn’t appropriate, so you try to squeeze it into the page query parameters, or form post data through hidden fields. But what if the software makes AJAX requests from jQuery? Luckily, jQuery can help you intercept AJAX requests so that you can customise them too. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Safely encode dynamically-built HTML and JavaScript

If you build fragments of HTML and JavaScript dynamically from browser script, you need to take care to encode any special characters in your strings. Building your HTML using DOM createElement() and createTextNode() is often better, but sometimes the better solution is to generate a block of HTML. Here’s a couple of simple functions to do that, quickly. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Add custom JavaScript actions to wp-e-commerce cart updates

I just stared in horror wonder at the wp-e-commerce script that handles cart updates. Wow. Just… wow. Forget any thought of nicely hooking into that to add some extra client-side actions, it’s a mess and looks like it will probably get worse before it gets better. But fortunately, there is another way. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail

Make CSS drop-down menus work on touch devices

CSS drop-down menus are very popular on sites with a hierarchy of pages. They let you get to where you want to go without having to navigate the pages in that hierarchy. But pure-CSS menus suffer a problem: touch devices often can’t show the drop-down, because they don’t have “hover” and clicking on the top level link goes there. This snippet offers a way around that. Continue reading

facebooktwittergoogle_plusredditpinterestlinkedinmailfacebooktwittergoogle_plusredditpinterestlinkedinmail