Skip to content

Instantly share code, notes, and snippets.

View ingowennemaring's full-sized avatar

Ingo Wennemaring ingowennemaring

8 followers · 1 following
View GitHub Profile
@ingowennemaring
ingowennemaring / detection.js
Last active December 14, 2015 20:19
Detect features and devices via JavaScript
// Engine/OS
var is_iPhone = navigator.platform.indexOf('iPhone') >= 0;
var is_iPad = navigator.platform.indexOf('iPad') >= 0;
var is_iOS = this.is_iPhone || this.is_iPad;
var is_iOS5 = this.is_iOS && window.navigator.appVersion.indexOf('OS 5_') >= 0;
var is_webkit = 'webkitRequestAnimationFrame' in window;
var is_win = navigator.appVersion.indexOf("Win") >= 0;
var is_mac = navigator.appVersion.indexOf("Mac") >= 0;
// Features
@ingowennemaring
ingowennemaring / handleurlparams.js
Last active December 15, 2015 05:19
Handle URL parameters: get, update, buildURL
function getURLParams() {
var i = 0,
params = {},
tmpParam = [],
pairs = window.location.href
.slice(window.location.href.indexOf('?') + 1)
.replace(window.location.hash, '')
.split('&');
for(; i < pairs.length; i++) {
@ingowennemaring
ingowennemaring / rollover.htm
Created April 18, 2013 11:34
Easy image rollover without effects
<img src="http://dummyimage.com/254x403/ccc/000.jpg&amp;text=254x403+-+Produkt" data-hover="http://dummyimage.com/254x403/999/000.jpg&amp;text=254x403+-+Produkt" alt="" />
@ingowennemaring
ingowennemaring / rollover_fade.htm
Last active December 16, 2015 09:19
Image rollover with preload and fade effect
<a href="#">
<img src="http://dummyimage.com/254x403/ccc/000.jpg&amp;text=254x403+-+Produkt" data-hover="http://dummyimage.com/254x403/999/000.jpg&amp;text=254x403+-+Produkt" alt="" />
</a>
@ingowennemaring
ingowennemaring / rollover_css.css
Last active December 16, 2015 09:28
Image Rollover with CSS, fade effect and image preload
figure {
display: inline-block;
position: relative;
margin: 0;
padding: 0;
img {
display: block;
&:last-child {
@ingowennemaring
ingowennemaring / scrolltotop.js
Created April 18, 2013 14:16
Scroll to top of page
$('.goto-top').on(
'click',
function(e){
e.preventDefault();
$('html, body').animate( { scrollTop: 0 } );
}
);
@ingowennemaring
ingowennemaring / scrolltoelement.js
Created April 18, 2013 14:19
Scroll to top of an element
$('.goto-element').on(
'click',
function(e) {
e.preventDefault();
var go = $(this).attr('href'),
position = $(go).position();
$('html, body').animate( { scrollTop: position.top } );
}
@ingowennemaring
ingowennemaring / has-js.htm
Created April 18, 2013 14:27
Adds a class to the <html> element if javascript is enabled
<script>document.documentElement.className = (document.documentElement.className !== "") ? "has-js " + document.documentElement.className : "has-js";</script>
@ingowennemaring
ingowennemaring / placeholder.js
Last active December 16, 2015 09:29
Polyfill for missing placeholder feature in IE <= 9
/*
Placeholder für MSIE/Opera
@param mode => only needed for e.g. responsive sites,
if sometimes placeholders should be shown and sometimes not or the placeholder changed in runtime
mode === 'hide' => add behavior, events and so on, but show no placeholder right now
mode === 'update' => update placeholders which were updated in runtime
*/
var placeholder = function( hidePlaceholder ) {
@ingowennemaring
ingowennemaring / selectivzr_redraw.htm
Last active December 16, 2015 09:29
Redraw selectivzr.js e.g. after loading content via AJAX
<html class="ie8">
<head>
<!--[if (gte IE 6)&(lte IE 8)]>
<script src="js/libs/selectivizr.min.js" type="text/javascript" id="selectivizr"></script>
<![endif]-->
</head>
<body>
</body>