Skip to content

Instantly share code, notes, and snippets.

@townivan
townivan / css local override
Last active January 2, 2016 03:49
Override Inline Styles with CSS Usually it goes the other way around, but you can override inline CSS with CSS elsewhere. Source: http://css-tricks.com/override-inline-styles-with-css/
HTML:
<div style="background: red;">
The inline styles for this div should make it red.
</div>
CSS:
div[style] {
background: yellow !important;
}
@townivan
townivan / iOS email links
Last active January 14, 2016 14:43
Email HTML - Override iOS auto-linking addresses and phone numbers. At least styling the link how you want.Source: https://litmus.com/blog/update-banning-blue-links-on-ios-devices?utm_campaign=bestpractices&utm_source=litmusblog&utm_medium=blog
@townivan
townivan / gist:8868858
Last active August 29, 2015 13:56
iOS keep it from turning everything into a link Source: http://www.industrydive.com/blog/how-to-fix-email-marketing-for-iphone-ipad/
break up your html that would normally trigger an iPhone linke (like address)
with this invisible zero-width character:
&#8203;
@townivan
townivan / gist:9020496
Last active August 29, 2015 13:56
redirect without javascript
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta http-equiv="refresh" content="0; url=http://www.yahoo.com" />
</head>
<body>
</body>
@townivan
townivan / gist:9021176
Last active August 29, 2015 13:56
Youtube embed setting to force higher quality and other settings that I like. All on a single page which just shows the video.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>video</title>
<style>
html, body, #wrapper { height:100%; width: 100%; margin: 0; padding: 0; border: 0;}
#wrapper td { vertical-align: middle; text-align: center; }
body{background-color:#CCC;}
</style>
@townivan
townivan / gist:9027611
Created February 16, 2014 00:54
jQuery base
<script>
$(document).ready(function() {
alert('test');
});
</script>
@townivan
townivan / gist:3507a1b74f8b5591ac62
Created June 16, 2014 14:15
Email HTML. Hide content on desktop but show it on mobile. This is tougher because Outlook 2007 (desktop) won't recognize CSS that you would use to normally hide something.
/* in your css. (in this example, in the media queries specific part which is just for phone) */
@media only screen and (max-device-width:480px){
*[class*="mobile-only"]{display:block !important;max-height:none !important}
}
<!-- this html section will only show on phones -->
<!--[if !mso]><!-- -->
@townivan
townivan / gist:d6dc47b4f2ffd20346b1
Created June 24, 2014 18:36
Phone number input help with JavaScript. This adds the 1 (country code) and strips out the dash if one is entered. The type=tel makes these input boxes trigger the numberpad on the phone rather than the full keyboard.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>phoneJS</title>
<meta name="viewport" content="width=device-width">
<script>
function phoneinput (event){
var p1 = document.getElementById("p1").value;
@townivan
townivan / gist:f8346fcc432db32518a6
Created July 3, 2014 22:38
jquerymobile add a control dynamically
<!DOCTYPE html>
<html>
<head>
<title>Load Control Dynamically</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script>
@townivan
townivan / gist:d24c9477723e1cb308fa
Created July 16, 2014 17:27
Use localstorage instead of cookies
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>