<script type='text/javascript'> $(window).load(function(){ $("#main-menu a").click(function() { $('.active').removeClass('active'); $(this).addClass("active"); }); });> </script> <style> .active {font-weight:bold} </style> <!--Navigation--> <nav id="main-menu"> <ul class="right"> <li><a href="#">Home</a></li> <li><a href="#">Test Link 1</a></li> <li><a href="#">Test Link 2</a></li> <li><a href="#">Test Link 3</a></li> </ul> </nav>
Thursday, 23 January 2014
Menu Active Button
Thursday, 2 January 2014
How do I use a gradient as a font color in CSS?
http://jsfiddle.net/HzzHA/ { Firefox }
http://jsfiddle.net/3rvsm/ { Chrome}
Monday, 23 December 2013
Current Time Watches
<script src="http://24timezones.com/js/swfobject.js" language="javascript"></script>
<script src="http://24timezones.com/timescript/cities2_countries/maindata.js.php?city=1000247374" language="javascript"></script>
<table><tr><td><div id="flash_container_tt52b40fd429f76"></div><script type="text/javascript">
var flashMap = new SWFObject("http://24timezones.com/timescript/clock_final.swf", "main", "175", "175", "7.0.22", "#FFFFFF", true)
flashMap.addParam("movie", "http://24timezones.com/timescript/clock_final.swf");
flashMap.addParam("quality", "high");
flashMap.addParam("wmode", "transparent");
flashMap.addParam("flashvars", "color=FF00FF&logo=1&city=1000247374");
flashMap.write("flash_container_tt52b40fd429f76");
</script></td></tr><tr><td style="text-align: center; font-weight: bold"><a href="http://24timezones.com/current_local/india_time.php" target="_blank" style="text-decoration: none" title="timezones India">India</a></td></tr></table>
Thursday, 21 November 2013
Placeholder IE using jquery for html5
<style>
.placeholder { color:#999; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
// A jQuery based placeholder polyfill
$(document).ready(function(){
function add() {
if($(this).val() === ''){
$(this).val($(this).attr('placeholder')).addClass('placeholder');
}
}
function remove() {
if($(this).val() === $(this).attr('placeholder')){
$(this).val('').removeClass('placeholder');
}
}
// Create a dummy element for feature detection
if (!('placeholder' in $('<input>')[0])) {
// Select the elements that have a placeholder attribute
$('input[placeholder], textarea[placeholder]').blur(add).focus(remove).each(add);
// Remove the placeholder text before the form is submitted
$('form').submit(function(){
$(this).find('input[placeholder], textarea[placeholder]').each(remove);
});
}
});
</script>
</head>
<body>
<input type='text' name='email' placeholder='Email Address'/>
<input type='password' name='password' placeholder='Password'/>
</div>
.placeholder { color:#999; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
// A jQuery based placeholder polyfill
$(document).ready(function(){
function add() {
if($(this).val() === ''){
$(this).val($(this).attr('placeholder')).addClass('placeholder');
}
}
function remove() {
if($(this).val() === $(this).attr('placeholder')){
$(this).val('').removeClass('placeholder');
}
}
// Create a dummy element for feature detection
if (!('placeholder' in $('<input>')[0])) {
// Select the elements that have a placeholder attribute
$('input[placeholder], textarea[placeholder]').blur(add).focus(remove).each(add);
// Remove the placeholder text before the form is submitted
$('form').submit(function(){
$(this).find('input[placeholder], textarea[placeholder]').each(remove);
});
}
});
</script>
</head>
<body>
<input type='text' name='email' placeholder='Email Address'/>
<input type='password' name='password' placeholder='Password'/>
</div>
Tuesday, 19 November 2013
Add ( DIV ) js
<script type="text/javascript">
$(window).load(function(){
var i=0;
$("#uniform-account_type > span").each(function(){
$(this).append("<div class='blk'></div>");
i++;
})
});
</script>
$(window).load(function(){
var i=0;
$("#uniform-account_type > span").each(function(){
$(this).append("<div class='blk'></div>");
i++;
})
});
</script>
Thursday, 3 October 2013
Add Remove Class Onclick For Checkbox AND jQuery addClass() Method
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>button demo</title>
<style>
.is-checked { color:red; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div class="fix_header">
<div class="test"> Add Remove Class </div>
<input type="checkbox" id="check">
</div>
<script>
$(window).load(function(){
$('#check').attr('checked',false);
})
$(function () {
$('.fix_header > input[type="checkbox"], input[type="radio"]').each(function () {
$(this).on('click', function () {
$(this).parent().wrap('<div>').unwrap();
// works great for checkboxes, but not for radios
if ($(this).prop('checked')) {
$('div.test').addClass('is-checked');
} else {
$('div.test').removeClass('is-checked');
}
})
})
})
</script>
</body>
</html>
-----------------------------------------------------------------
<script src="http://code.jquery.com/jquery.js"></script>
<script>
jQuery(document).ready(function () {
$('input.pokazkontakt').each(function(){
if ($(this).is(':checked')) {
$(this).parent().nextAll('.pkbox:first').css('display', 'none');
} else {
$(this).parent().nextAll('.pkbox:first').css('display', 'block');
}
});
$('input.pokazkontakt').click(function () {
$(this).parent().nextAll('.pkbox:first').toggle('fast');
});
});
</script>
<title>Checked Box</title>
</head>
<body>
<h3><input type="checkbox" checked="checked" class="pokazkontakt">Bla bla</h3>
<div class="pkbox">bla bla</div>
-----------------------------------------------------------------
-----------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$(".button").click(function(){
$("#div1").addClass("important blue");
});
});
</script>
<style type="text/css">
.important
{
font-weight:bold;
font-size:xx-large;
}
.blue
{
display:none;
}
</style>
</head>
<body>
<div id="div1">This is some text.</div>
<div id="div2">This is some text.</div>
<br>
<div class="button">Button</div>
</body>
</html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>button demo</title>
<style>
.is-checked { color:red; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div class="fix_header">
<div class="test"> Add Remove Class </div>
<input type="checkbox" id="check">
</div>
<script>
$(window).load(function(){
$('#check').attr('checked',false);
})
$(function () {
$('.fix_header > input[type="checkbox"], input[type="radio"]').each(function () {
$(this).on('click', function () {
$(this).parent().wrap('<div>').unwrap();
// works great for checkboxes, but not for radios
if ($(this).prop('checked')) {
$('div.test').addClass('is-checked');
} else {
$('div.test').removeClass('is-checked');
}
})
})
})
</script>
</body>
</html>
-----------------------------------------------------------------
checkbox id display none
-----------------------------------------------------------------<script src="http://code.jquery.com/jquery.js"></script>
<script>
jQuery(document).ready(function () {
$('input.pokazkontakt').each(function(){
if ($(this).is(':checked')) {
$(this).parent().nextAll('.pkbox:first').css('display', 'none');
} else {
$(this).parent().nextAll('.pkbox:first').css('display', 'block');
}
});
$('input.pokazkontakt').click(function () {
$(this).parent().nextAll('.pkbox:first').toggle('fast');
});
});
</script>
<title>Checked Box</title>
</head>
<body>
<h3><input type="checkbox" checked="checked" class="pokazkontakt">Bla bla</h3>
<div class="pkbox">bla bla</div>
-----------------------------------------------------------------
-----------------------------------------------------------------
jQuery addClass() Method
-----------------------------------------------------------------<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$(".button").click(function(){
$("#div1").addClass("important blue");
});
});
</script>
<style type="text/css">
.important
{
font-weight:bold;
font-size:xx-large;
}
.blue
{
display:none;
}
</style>
</head>
<body>
<div id="div1">This is some text.</div>
<div id="div2">This is some text.</div>
<br>
<div class="button">Button</div>
</body>
</html>
Thursday, 26 September 2013
Center - Middle Dynamic Code For IE Browser Sported...
<style>
html, body {
height: 100%;
background: #0099FF;
}
.inlay {
height: 100%;
text-align: center;
}
.inlay img {
vertical-align: middle;
}
.helper {
display: inline-block;
height: 100%;
vertical-align: middle;
}
</style>
<div class="inlay">
<span class="helper"></span><img src="../yourImages.jpg" />
IE Browser Sported Center-Middle Images Dynamic Code
</div>
html, body {
height: 100%;
background: #0099FF;
}
.inlay {
height: 100%;
text-align: center;
}
.inlay img {
vertical-align: middle;
}
.helper {
display: inline-block;
height: 100%;
vertical-align: middle;
}
</style>
<div class="inlay">
<span class="helper"></span><img src="../yourImages.jpg" />
IE Browser Sported Center-Middle Images Dynamic Code
</div>
Subscribe to:
Posts (Atom)