<input type="checkbox" checked="true" onclick="return false"/>
Showing posts with label JQuery. Show all posts
Showing posts with label JQuery. Show all posts
Thursday, 30 May 2013
Wednesday, 29 May 2013
Tuesday, 16 April 2013
Attaches a change event to the select that gets the text for each selected option and writes them in the div. It then triggers the event for the initial text draw.
!DOCTYPE html>
<html>
<head>
<style>
div { color:red; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<select name="garden" multiple="multiple">
<option>Flowers</option>
<option selected="selected">Shrubs</option>
<option>Trees</option>
<option selected="selected">Bushes</option>
<option>Grass</option>
<option>Dirt</option>
</select>
<div></div>
<script>
$("select").change(function () {
var str = "";
$("select option:selected").each(function () {
str += $(this).text() + " ";
});
$("div").text(str);
})
.trigger('change');
</script>
</body>
</html>
Thursday, 11 April 2013
<SCRIPT language="javascript">$(function(){ // add multiple select / deselect functionality $("#selectall").click(function () { $('.case').attr('checked', this.checked); }); // if all checkbox are selected, check the selectall checkbox // and viceversa $(".case").click(function(){ if($(".case").length == $(".case:checked").length) { $("#selectall").attr("checked", "checked"); } else { $("#selectall").removeAttr("checked"); } });});</SCRIPT> |
Wednesday, 10 April 2013
$('input[name="currentPage"]').attr('value',currentPage);
$("#whereToId").change(function () {
var str = "";
$("#whereToId option:selected").each(function () {
str += $(this).val() + " ";
});
alert(str);
})
.change();
<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<p>I would like to say: </p>
<div id="mydiv"></div>
<script>
$("p").append("<strong>Hello</strong>");
$("#mydiv").append("<p><strong>Hello</strong></p>");
</script>
</body>
</html>
Wednesday, 30 January 2013
Following is the trick that will guide you to implement the same in your blogger blog.
Step -1 ) Go to your blogger dashboard -> Template -> Edit HTML -> Proceed
Step-2) Copy the following snippet and paste it immediately after "
Step-4) Click "SAVE TEMPLATE"
Step-5) Come back to Blogger Dashboard -->Posts-->New Post.
Step-6) The programming code snippen that you put in, needs to have its HTML cleaned from. Hence to do this just paste your code in here: http://www.simplebits.com/cgi-bin/simplecode.pl
Step-7) Put your code inside a "<pre>" tag and add a
OR
Step-8) In your Blogger Text Editor, switch from Compose mode to HTML mode
Step-9) Paste it into blogger and publish it.
Step -1 ) Go to your blogger dashboard -> Template -> Edit HTML -> Proceed
Step-2) Copy the following snippet and paste it immediately after "
<head>"<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/>
<style>
code.prettyprint, pre.prettyprint{
font-family: Courier,monospace,Courier New;
font-size: 13px;
color: rgb(0, 0, 0);
border: 2px dashed rgb(222, 222, 222);
padding: 10px;
line-height: 16px;
width: 547px;
}
code, pre{
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
</style>
<script language='javascript' src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js' type='text/javascript'/>
<script language='javascript' src='http://google-code-prettify.googlecode.com/svn/trunk/src/lang-css.js' type='text/javascript'/>
Step-3) Now replace "<body>" with "<body onload='prettyPrint()'>"Step-4) Click "SAVE TEMPLATE"
Step-5) Come back to Blogger Dashboard -->Posts-->New Post.
Step-6) The programming code snippen that you put in, needs to have its HTML cleaned from. Hence to do this just paste your code in here: http://www.simplebits.com/cgi-bin/simplecode.pl
Step-7) Put your code inside a "<pre>" tag and add a
"prettyprint" class to your <pre> tag Ex: <pre class="prettyprint">int foo=0;
NSLog(@"%i", foo);
</pre>
OR
<pre class="prettyprint">int foo=0;
NSLog(@"%i", foo);
</pre> Step-8) In your Blogger Text Editor, switch from Compose mode to HTML mode
Step-9) Paste it into blogger and publish it.
Wednesday, 21 November 2012
var a=3;
var b='6';
var c=a+parseInt(b);
alert("Sum:"+c);
Output:
Sum: 9
var b='6';
var c=a+parseInt(b);
alert("Sum:"+c);
Output:
Sum: 9
Jquery Show/Hide a div onclick.
<style>
body{
font-family:Verdana, Geneva, sans-serif;
font-size:14px;}
.slidingDiv {
height:100px;
width:150px;
background-color: #99CCFF;
padding:20px;
margin-top:10px;
border-bottom:5px solid #3399FF;
}
.show_hide {
display:none;
}
</style>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});
});
</script>
<a href="#" class="show_hide">Show/hide</a><br />
<div class="slidingDiv">
<a href="profile.htm" style="text-decoration:none;">Profile</a></br>
<a href="changepassword.htm" style="text-decoration:none;">Change Password</a></br>
<a href="logout.htm" style="text-decoration:none;">Profile</a>
</br>
<a href="#" class="show_hide">hide</a>
</div>
Tuesday, 20 November 2012
Download Complete Code:
Download Here
Subscribe to:
Posts (Atom)
Blogger
