Skip to content

Instantly share code, notes, and snippets.

View idevwise's full-sized avatar
🖖

Rahul Kumar idevwise

🖖
0 followers · 4 following
View GitHub Profile
@idevwise
idevwise / focusLoopingUtil.js
Last active October 19, 2022 16:58
Utility to loop focus inside a DOM element
/**
* Selectors for all focusable elements
* @type {string}
*/
const FOCUSABLE_ELEMENT_SELECTORS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, [tabindex="0"], [contenteditable]';
const KEY_CODE_MAP = {
TAB: 9
};
@idevwise
idevwise / absoluteLayoutJS.js
Created September 10, 2017 17:15
JavaScript for the absolutely positioned layout built for
document.addEventListener('DOMContentLoaded', () => {
setPlatformInfo();
var inputBox = document.querySelector('.safari #inputBox');
if(inputBox) {
inputBox.addEventListener('focus', function(e) {
document.body.classList.add('keyboard');
setTimeout(function() {
window.scrollTo(0, 0);
}, 200);
});
@idevwise
idevwise / absoluteLayout.css
Last active September 10, 2017 17:10
Absolutely positioned layout
.app-container {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
header, footer, main {
position: absolute;
@idevwise
idevwise / fixedLayout.css
Last active September 10, 2017 16:22
Fixed position layout
header, footer {
position: fixed;
text-align: center;
width: 100%;
background-color: blue;
color: white;
height: 48px;
line-height: 48px;
}
@idevwise
idevwise / index.html
Created September 7, 2017 16:04
JS Bin // source http://jsbin.com/qupogu/6
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
header, footer {
position: fixed;
text-align: center;
@idevwise
idevwise / index.html
Created September 7, 2017 14:44
JS Bin // source http://jsbin.com/qupogu
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
header, footer {
position: fixed;
text-align: center;