Skip to content

Instantly share code, notes, and snippets.

@sathvikc
sathvikc / button.html
Created September 8, 2015 10:30
Button With Line Breaks
<input type="button" value="Really&#x00A;Tall&#x00A; Button">
@sathvikc
sathvikc / ie.html
Created September 8, 2015 10:28
Write HTML only for IE
<!--[if IE ]>
//Your code
<![endif]-->
<!--[if IEMobile 7 ]>
//Your code
<![endif]-->
<!--[if lt IE 7 ]>
//Your code
@sathvikc
sathvikc / searchInput.js
Created September 8, 2015 10:22
hover search box animation
<div id="search">
<input type="text" style="width:20px"/>
</div>
<script>
$("#search input").hover(function() {
$(this).animate({
width:"200px",
},800);
$(this).css("background-position","right");
@sathvikc
sathvikc / scroll.js
Created September 8, 2015 09:46
smooth scroll to top
$("a[href='#top']").click(function() {
$("html, body").animate({
scrollTop: 0
}, "slow");
return false;
});
@sathvikc
sathvikc / checkjQuery.js
Created September 8, 2015 09:41
Check whether jQuery is installed or not
if(typeof jquery!="undefined") {
//jQuery is installed
// Write your code
} else {
//jQuery not installed
// Write your code
}
@sathvikc
sathvikc / randomColor.js
Created September 7, 2015 17:01
Random Colors using Java Script
function getRandomColor() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 15)];
}
return color;
}
@sathvikc
sathvikc / colours.css
Created September 7, 2015 16:58
Changing colour using CSS
/*
Mention the tag id="typed".
For eg. : <h1 id="typed">Color Changer</h1>
*/
#typed{
animation-name:color_change;
animation-duration:1s;
animation-iteration-count:infinite;
animation-direction:alternate;
@sathvikc
sathvikc / mobiledetect.js
Created September 3, 2015 04:56
To detect Mobile browsers
<script language="javascript">
function detectmob() {
if( navigator.userAgent.match(/Android/i)|| navigator.userAgent.match(/webOS/i)|| navigator.userAgent.match(/iPhone/i)|| navigator.userAgent.match(/iPad/i)|| navigator.userAgent.match(/iPod/i)|| navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i)|| navigator.userAgent.match(/Opera Mini/i)) {
return true;
}
else {
return false;
}
}
if(detectmob()){
@sathvikc
sathvikc / less.html
Created September 2, 2015 17:06
Lesscss configuration without downloading Less files
<!--
Add this line to your html file
-->
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js"></script>
<!--
To run less files ..
Import your web files to your local server htdocs (XAMPP,WAMP etc)
Then run your html files from the local web server.
-->
@sathvikc
sathvikc / typing.css
Created September 2, 2015 16:41
Typing effect using CSS3
<html>
<head>
<style type="text/css">
p{
color: #000;
font-family: "Segoe UI";
font-size: 20px;
white-space: nowrap;
overflow: hidden;
width: 100%;