Skip to content

Instantly share code, notes, and snippets.

View neocreo's full-sized avatar

Daniel Hansson neocreo

View GitHub Profile
@neocreo
neocreo / inputfields
Created March 23, 2012 09:13
JQuery: empty a specific input box using jQuery
function input_values()
{
//First let's agree on which input we mean - the input-element in another element with the name "search"
var inputBox = $('form#formname input, form#formname textarea');
//Now this should be triggered when we give the input focus - not click!
inputBox.focus(function(){
theTemp = $(this).attr('temp'); //The temp value - if it exists
var theValue = $(this).val(); //The value of the input
//Now either the temp value is undefined (first time) or the temp and value are the same - 'Search' in any given language
if(theTemp == undefined || theTemp == theValue){
@neocreo
neocreo / skeleton html5
Last active October 18, 2016 14:21
HTML: Start template HTML5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><![endif]-->
<title>Title</title>
<!-- mobile meta (hooray!) -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
@neocreo
neocreo / gist:5031447
Created February 25, 2013 17:19
CSS: image replacement
.ir{
border: 0;
font: 0/0 a;
text-shadow: none;
color: transparent;
background-color: transparent;
}
@neocreo
neocreo / border-radius
Created February 27, 2013 11:48
CSS: border-radius
-webkit-border-radius: ${1:9px};
-moz-border-radius: ${1};
border-radius: ${1};
@neocreo
neocreo / transition
Created February 27, 2013 11:51
CSS: transition
-webkit-transition: ${1} ${2} ${3} ${4};
-moz-transition: ${1} ${2} ${3} ${4};
-o-transition: ${1} ${2} ${3} ${4};
-ms-transition: ${1} ${2} ${3} ${4};
transition: ${1:property | background-color} ${2:duration | 0.5s} ${3:timing-function | ease | linear | ease-in | ease-out | ease-in-out} ${4:delay | 2s};
@neocreo
neocreo / transform
Created February 27, 2013 11:51
CSS: transform
-webkit-transform: ${1}
-moz-transform: ${1}
-o-transform: ${1}
-ms-transform: ${1}
transform: ${1:property | rotate(360deg) | skew(x-angle,y-angle) | scale(x,y) | scale3d(x,y,z) | translate(x,y) | none};
/*Use together with transitions for animation*/
@neocreo
neocreo / text-shadow
Created February 27, 2013 11:52
CSS: text-shadow
<snippet>
<content><![CDATA[
text-shadow: ${1:2px} ${2:2px} ${3:5px} ${4:#000000} ;
]]></content>
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<tabTrigger>text</tabTrigger>
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<scope>source.css</scope>
@neocreo
neocreo / opacity
Created February 27, 2013 11:53
CSS: opacity cross browser
/*--IE9 WILL PLACE THE FILTER ON TOP OF THE ROUNDED CORNERS--*/
opacity: ${1:0.5};
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = ${2:80});
/*-ms-filter must come before filter*/
filter: alpha(opacity = ${2:80});
@neocreo
neocreo / gradient vertical
Created February 27, 2013 11:53
CSS: gradient vertical
background-image: -moz-linear-gradient(top, ${1:#ffffff}, ${2:#000000});
background-image: -ms-linear-gradient(top, ${1}, ${2});
background-image: -o-linear-gradient(top, ${1}, ${2});
background-image: -webkit-gradient(linear, center top, center bottom, from(${1}), to(${2}));
background-image: -webkit-linear-gradient(top, ${1}, ${2});
background-image: linear-gradient(top, ${1}, ${2});
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
/*Use "background-clip: padding-box" when using rounded corners to avoid the gradient bleeding through the corners*/
@neocreo
neocreo / box-shadow
Created February 27, 2013 11:54
CSS: box-shadow
-moz-box-shadow: ${1:inset} ${2:horisontal} ${3:vertical} ${4:blur} ${5:spread} ${6:color};
-webkit-box-shadow: ${1} ${2} ${3} ${4} ${5} ${6};
box-shadow: ${1} ${2} ${3} ${4} ${5} ${6};
/*Inner elements should not cover inner shadows*/
/*Chrome renders inset shadows incorrectly with border-radius*/