Serve SVG with the Correct Content Type

If you are trying to use SVG like <img src=”image.svg”> or as a CSS background-image and the file is linked to correctly and everything seems right, but the browser isn’t displaying it, it might be because your server is serving it with an incorrect content-type. Add this to your .htaccess file at the root to […]

Read More

htaccess iPhone Detection

<IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{HTTP_USER_AGENT} .*iPhone.* RewriteRule ^index\.html$ http://www.mobile.mydomain.com [L] RewriteRule ^/$ http://www.mydomain.com/index.html [L] </IfModule>   This will redirect iPhone users to a URL you specify.

Read More

htaccess iPad Detection

Of course, the iPad is a pretty large screen and a fully capable browser, so most websites don’t need to have iPad specific versions of them. But if you need to, you can detect for it with .htaccess RewriteCond %{HTTP_USER_AGENT} ^.*iPad.*$ RewriteRule ^(.*)$ http://ipad.yourdomain.com [R=301] This will redirect iPad users to a URL you specify. […]

Read More

Denying and Allowing Access

Deny except from specific IPs Order deny,allow Deny from All Allow from xxx.xxx.xxx.xxx Allow from xxx.xxx.xxx.xxy Allow except from specific IPs Order deny,allow Allow from All Deny from xxx.xxx.xxx.xxx Deny from xxx.xxx.xxx.xxy Reference URL

Read More

Smarter Event Binding

$(“p”).on(“click”, function(){ $(this).css(“color”, “red”); }); The reason this is smarter is because there are likely many p elements on the page. If there were, say, 10 of them, traditional click event binding would require 10 handlers. The live function only requires one, reducing memory needed by the browser. Then imagine compounding the issue by 100 […]

Read More

Combine Slide and Fade Functions

$.fn.slideFadeToggle = function(speed, easing, callback) { return this.animate({opacity: ‘toggle’, height: ‘toggle’}, speed, easing, callback); }; Usage $(“#something”).click(function() { $(this).slideFadeToggle(); css tricks

Read More

Add Active Navigation Class Based on URL

Ideally you output this class from the server side, but if you can’t… Let’s say you have navigation like this: <nav> <ul> <li><a href=”/”>Home</a></li> <li><a href=”/about/”>About</a></li> <li><a href=”/clients/”>Clients</a></li> <li><a href=”/contact/”>Contact Us</a></li> </ul> </nav> And you are at the URL: http://yoursite.com/about/team/ And you want the About link to get a class of “active” so you can […]

Read More