Showing posts with label Snippets. Show all posts
Showing posts with label Snippets. Show all posts

Friday, November 18, 2011

Automatic external link open in New Window

11:15 AM    No comments

[javascript]
$('a').each(function() {
var a = new RegExp('/' + [removed].host + '/');
if(!a.test(this.href)) {
$(this).click(function(event) {
event.preventDefault();
event.stopPropagation();
window.open(this.href, '_blank');
});
}
});
[/javascript]

Read More

Partial Page Refresh

11:12 AM    No comments

[javascript]
setInterval(function() {
$("#refresh").load(location.href+" #refresh>*","");
}, 10000); // seconds to wait, miliseconds
[/javascript]

Read More

On Hover add and Remove a class

11:11 AM    No comments

[javascript]
$('.onhover').hover(
function(){ $(this).addClass('hover_style_class') },
function(){ $(this).removeClass('hover_style_class') }
)
[/javascript]

Read More

Wednesday, November 16, 2011

Redirect Using Javascript

10:29 AM    No comments

If you need to redirect a page using jQuery:
[javascript]
// Redirect - insert required URL
window.location.href = "http://designchemical.com/";
[/javascript]

Read More

Change Browser Address Bar Hash Parameter

10:26 AM    No comments

In the example below we replace the hash parameter, which we get from the clicked link. Useful for adding bookmarking capabilities when using AJAX:
[javascript]
// update browser address bar URL
$('a.demo-link').click(function(){
var hash = $(this).attr('href');
location.hash = hash;
});
[/javascript]

Read More

Get A URL Hash Parameter

10:24 AM    No comments

Retrive a hash parameter and store in a variable:
[javascript]
// Get # parameter
var param = document.URL.split('#')[1];
[/javascript]

Read More

Get The Current Root URL

10:22 AM    1 comment

A very simple snippet, which stores the root URL in a variable:
[javascript]
// Retrieve root URL
var root = location.protocol + '//' + location.host;
[/javascript]

Read More

Get The Current Page URL

10:21 AM    No comments

A very simple snippet, which stores the current page URL in a variable:
[javascript]
// Retrieve current URL
var url = document.URL;
[/javascript]

Read More

Fix YouTube iFrame Overlay and Z-Index Issues

10:17 AM    No comments

fix youtube iframe overlay
[javascript]
$(document).ready(function() {
$("iframe").each(function(){
var ifr_source = $(this).attr('src');
var wmode = "wmode=transparent";
if(ifr_source.indexOf('?') != -1) {
var getQString = ifr_source.split('?');
var oldString = getQString[1];
var newString = getQString[0];
$(this).attr('src',newString+'?'+wmode+'&'+oldString);
}
else $(this).attr('src',ifr_source+'?'+wmode);
});
});
[/javascript]
[snippetsrc href='http://maxmorgandesign.com/fix_youtube_iframe_overlay_and_z_index_issues/']

Read More

Opening / closing jstree node

10:13 AM    No comments

Clicking on node makes it toggle between opened and closed. Nodes needs to have id attribute for this to work.
[javascript]
.bind("select_node.jstree", function (event, data) {
var id = data.rslt.obj.attr("id");
if (id != undefined) {
if ($("li[id=" + id + "]").hasClass("jstree-open"))
$("#treeViewContainer").jstree("close_node", "#" + id);
else
$("#treeViewContainer").jstree("open_node", "#" + id);
}
}

<div id="treeViewContainer">
<ul>

</ul>
</div>
[/javascript]

Read More

Hover animation

10:11 AM    No comments

[javascript]
$(".sidebar-hover li a, ul.menu li ul li a").hover(function() {
$(this).stop().animate({
borderWidth: "10px",
borderLeftColor: "#47D322"
}, 150);
},function() {
$(this).stop().animate({
borderWidth: "0px",
borderLeftColor: "#202020"
}, 150);
});
});
[/javascript]

Read More

Display values of Array with a Loop

10:09 AM    No comments

[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Sorting</title>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js?ver=3.2.1'></script>

<script type="text/javascript">
$('document').ready(function () {

var arr = [52, 97, 3, 62, 10, 63, 64, 1, 9, 3, 4];

for (i = 0; i < arr.length; i++) {
$('p#test' + i).html(arr[i]);
}

});

</script>
</head>
<body>
<h1>This is a sorting example</h1>
<p id="test0">test</p>
<p id="test1">test</p>
<p id="test2">test</p>
<p id="test3">test</p>
<p id="test4">test</p>
<p id="test5">test</p>
<p id="test6">test</p>
<p id="test7">test</p>
<p id="test8">test</p>
<p id="test9">test</p>
<p id="test10">test</p>
<div><input type="button" value="sort" id="sortButton" /></div>
</body>
</html>
[/html]

Read More

Scroll to top function

10:08 AM    No comments

[javascript]
$(function () {
$("#white-paper-call-out").click(function () {
$('html, body').animate({
scrollTop: $("#form-lawyerist").offset().top
}, 2000);
$(".white-paper-input").focus();
return false;
});
});
[/javascript]

Read More

Tuesday, November 8, 2011

Show last tweet with jquery

4:57 AM    No comments

[javascript]
$.getJSON("http://twitter.com/statuses/user_timeline/username.json?callback=?", function(data){
$("#twitter").html(data[0].text);
});
[/javascript]

Read More

jQuery get total height

4:52 AM    No comments

[javascript]
$.fn.totalHeight = function() {
var total = 0;
this.each(function(i, el) {
total += $(el).height();
});
return total;
};
$.fn.totalOuterHeight = function() {
var total = 0;
this.each(function(i, el) {
total += $(el).outerHeight();
});
return total;
};
[/javascript]

Read More

Monday, November 7, 2011

Hide div with setTimeout

1:34 AM    No comments

[javascript]
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>hide div com setInterval</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
<script>
$(document).ready(function() {
function sumir_floater() {
var div = $("#floater");
div.fadeIn();
div.queue(function() {
setTimeout(function() {
div.dequeue();
}, 5000);
});
div.fadeOut("fast");
}

sumir_floater();

});
</script>
</head>

<body>
<div id="floater">
<p>Image or Text here</p>
</div>
</body>
</html>
[/javascript]

Read More

jQuery - Easy image rollover

1:33 AM    No comments

[javascript]
$(".hover").hover( function() {
var currentImage = $(this).attr("src");
$(this).attr("src", $(this).attr("hover"));
$(this).attr("hover", currentImage);
//css("background-position", "-50px 0");
}, function() {
var currentImage = $(this).attr("src");
$(this).attr("src", $(this).attr("hover"));
$(this).attr("hover", currentImage);
});
[/javascript]

Read More

Sorting with jQuery

1:32 AM    No comments

[javascript]
var mylist = $('ul');
var listitems = mylist.children('li').get();
listitems.sort(function(a, b) {
var compA = $(a).text().toUpperCase();
var compB = $(b).text().toUpperCase();
return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });
[/javascript]

Read More

jQuery Ajax Error Handling

1:29 AM    No comments

[javascript]
$.ajax({
url: '',
type: 'POST',
dataType: 'json',
data: {},
beforeSend: function(){
$('#load-msg').show();
},
success: function(data) {
$('#load-msg').hide();
if(data.errorStatus){
alert(data.errorMsg || 'An error has occurred');
}else{
// do stuff
}
},
error: function() {
$('#load-msg').hide();
alert('An error has occurred');
}
});
[/javascript]

Read More

jQuery Zebra Stripes

1:28 AM    No comments

Place inside document ready.
[javascript]
// make zebra stripes
var zebraodd = "#364146";
var zebraeven = "#102227";
$("table.zebra tr:odd, ul.zebra li:odd").css("background-color", zebraodd);
$("table.zebra tr:even, ul.zebra li:even").css("background-color", zebraeven);
[/javascript]

Read More