Skip to content

Instantly share code, notes, and snippets.

@owlsky
owlsky / Simple Scroll Up
Created October 7, 2013 06:14
Simple Scroll Up jQuery
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollup').fadeIn();
} else {
$('.scrollup').fadeOut();
}
});
@owlsky
owlsky / perfectly-justified-css-grid-technique-using-inline-block.css
Created October 12, 2013 03:15
perfectly-justified-css-grid-technique-using-inline-block
.wrapper{
width: 550px;
text-align: justify;
background: firebrick;
font-size: 0;
font-size: 12px\9; /* IE6-9 only hack */
}
.wrapper div{
background: white;
@owlsky
owlsky / Cross Browser Box-Shadow.css
Created October 12, 2013 03:22
Cross Browser Box-Shadow
.box-shadow {
-moz-box-shadow: 2px 2px 3px #969696; /* for Firefox 3.5+ */
-webkit-box-shadow: 2px 2px 3px #969696; /* for Safari and Chrome */
box-shadow: 2px 2px 3px #969696; /* W3C */
filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3);
}
@owlsky
owlsky / A New CSS Image Replacement Technique.css
Last active October 6, 2016 13:48
CSS: A New CSS Image Replacement Technique
.logo a {
display: block;
width: 52px;
height: 52px;
background: url(../img/logo.jpg) 0 0 no-repeat;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
@owlsky
owlsky / gist:0420c6220e62d2ba51a3
Created September 13, 2014 04:31
Style Placeholder Text
::-webkit-input-placeholder {
color: red;
}
:-moz-placeholder { /* Firefox 18- */
color: red;
}
::-moz-placeholder { /* Firefox 19+ */
color: red;
@owlsky
owlsky / Converting Photoshop Letter Spacing to CSS.scss
Last active December 17, 2017 18:36
Converting Photoshop Letter Spacing to CSS
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----
// Converting Photoshop Letter Spacing to CSS
@function getLetterSpacing($num) {
@return ($num / 1000) + em;
}