Skip to content

Instantly share code, notes, and snippets.

View asha23's full-sized avatar
🎩
Working from home

Ash Whiting asha23

🎩
Working from home
View GitHub Profile
/*
* Vanilla JS - Touch Gestures
* @version 0.1
* @inspired QuoJS - http://quojs.tapquo.com
*
* Supported Gestures: singleTap, doubleTap, hold,
* swipe, swiping, swipeLeft, swipeRight, swipeUp, swipeDown,
* rotate, rotating, rotateLeft, rotateRight, pinch, pinching,
* pinchIn, pinchOut,
* drag, dragLeft, dragRight, dragUp, dragDown
@asha23
asha23 / fx.js
Created October 2, 2013 16:53 — forked from vitalyrotari/fx.js
(function (window, Element, undefined) {
'use strict';
var prefix = '',
eventPrefix,
vendors = { Webkit: 'webkit', Moz: '', O: 'o', ms: 'MS' },
document = window.document,
testEl = document.createElement('div'),
supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i,
transform,
@media only screen and (min-device-width: 800px) and (orientation: portrait) {
#device:after {
content: "Nexus 7 - portrait - firefox";
}
}
@media screen and (min-device-width : 602px) and (orientation: portrait) {
#device:after {
content: "Nexus 7 - portrait - chrome";
}
}
.clear_margin_padding() {
margin: 0 !important;
padding: 0 !important;
padding-left: 0px !important;
padding-right: 0px !important;
}
.rounded-corners (@radius: 5px) {
border-radius: @radius;
-webkit-border-radius: @radius;
@asha23
asha23 / livechat.html
Created February 13, 2014 14:33 — forked from soe/livechat.html
<html>
<body>
<!-- live chat button -->
<a id="liveagent_button_online_573i00000004DD7" href="javascript://Chat" style="display: none;" onclick="liveagent.startChat('573i00000004DD7')">
Online Chat
</a>
<div id="liveagent_button_offline_573i00000004DD7" style="display: none;">
Offline Chat
</div>

My approach to fix the iOS bug is documented here:

https://github.com/sergiolopes/ios-zoom-bug-fix

Here I present one experiment with a pure CSS solution, no JS required. It uses width=device-width normally (no device-height hacking) and scales down the page on landscape.

Works fine on all iOS versions.

There's only one problem: on old iOS versions (prior to 4.3.5), the page will get a big empty space at bottom, below the content, when on landscape. Recent iOS versions don't show this behavior.

// FitVids
jQuery(document).ready(function(){
// Target your #container, #wrapper etc.
jQuery("#wrapper").fitVids({ customSelector: "div[class^='video-js-wrapper']"});
});