Skip to content

Instantly share code, notes, and snippets.

@A973C
A973C / scroll.js
Created February 2, 2014 18:51
Smooth scrolling to top of page #jquery
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
@A973C
A973C / header.js
Created February 2, 2014 18:52
Clone table header to the bottom of table #jquery
var $tfoot = $('<tfoot></tfoot>');
$($('thead').clone(true, true).children().get().reverse()).each(function(){
$tfoot.append($(this));
});
$tfoot.insertAfter('table thead');
@A973C
A973C / height.js
Created February 2, 2014 18:53
Equal height columns
var maxheight = 0;
$("div.col").each(function(){
if($(this).height() > maxheight) { maxheight = $(this).height(); }
});
$("div.col").height(maxheight);
@A973C
A973C / table.js
Created February 2, 2014 18:54
Table Stripes (Zebra)
$(document).ready(function(){
$("table tr:even").addClass('stripe');
});
@A973C
A973C / refresh.js
Created February 2, 2014 18:54
Partial page refresh
setInterval(function() {
$("#refresh").load(location.href+" #refresh>*","");
}, 10000); // milliseconds to wait
@A973C
A973C / link.js
Created February 2, 2014 18:55
Open external links in a new tab/window
@A973C
A973C / form.html
Created February 2, 2014 18:56
Test password strength
<input type="password" name="pass" id="pass" />
<span id="passstrength"></span>
@A973C
A973C / image.js
Created February 2, 2014 18:57
Check if an image is loaded
var imgsrc = 'img/image1.png';
$('<img/>').load(function () {
alert('image loaded');
}).error(function () {
alert('error loading image');
}).attr('src', imgsrc);
@A973C
A973C / list.js
Created February 2, 2014 18:57
Sort a list alphabetically
$(function() {
$.fn.sortList = function() {
var mylist = $(this);
var listitems = $('li', mylist).get();
listitems.sort(function(a, b) {
var compA = $(a).text().toUpperCase();
var compB = $(b).text().toUpperCase();
return (compA < compB) ? -1 : 1;
});
$.each(listitems, function(i, itm) {

Responsive Mail UI

Credit for design goes to Vivek Venkatraman: http://dribbble.com/shots/1455744-Email-Concept/

Check it out in full view to see it's responsiveness. It's responsive until pretty darn small but i haven't actually tested it on mobile devices. Tested in IE9+, latest Chrome and Firefox.

I've noticed the message (slide-in section) is some times visible on page load. If that's the case just reload the page, that's a browser bug.

A Pen by A973C on CodePen.