HTML:
<a href="http://www.google.com" rel="external">Google</a>
Javascript:
$(document).ready(function() {
$("a[rel=external]").attr(‘target’, ‘_blank’);
});
Or
$(document).ready(function() {
$(‘a[rel="external"]‘).click( function() {
window.open( $(this).attr(‘href’) );
return false;
});
});
Continue reading Open link in a new window using jQuery
You will need to sign up for the Google Maps API key and replace “INSERT_API_KEY_HERE” with your API key.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Google Map and Street View</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=INSERT_API_KEY_HERE" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) [...]
Continue reading Code to embed Google Map and Street View
There are many ways to style input buttons in CSS. And this is how I do it.
HTML
<input type=”submit” name=”submit” value=”Send” id=”submit” />
CSS
#submit {
color: #fff;
font-size: 0;
width: 135px;
height: 60px;
border: none;
margin: 0;
padding: 0;
background: #0c0 url(images/send-now.gif) 0 0 no-repeat;
}
And that’s it, you will have a nice [...]
Continue reading How to style a Submit button in CSS
If file names or page urls of your website have changed during site redevelopment and you are worried about losing your existing search engine rankings, referrals, and bookmarked links, the most efficient solution is to create 301 Redirect to redirect old pages to the new ones. The code “301” means “moved permanently“. There [...]
Continue reading How to redirect old pages to new pages using htaccess
$(‘ul.links li a’).click(function(e){
if ($(this).hasClass(‘current’)) {
// do nothing
} else {
// animation and other effects go here
}
e.preventDefault();
}
in jQuery
Continue reading If it is a current link, don’t do anything
HTML:
<a href="#" class="top">Back to Top</a>
Javascript:
$(‘a.top’).click(function(){
$(‘html, body’).animate({scrollTop: ‘0px’}, 300);
return false;
});
Recommended Books on jQuery
jQuery Cookbook: Solutions & Examples for jQuery Developers
jQuery in Action
Continue reading Back to top link with jQuery
a {
word-wrap: break-word;
}
Works for a long text too:
p {
word-wrap: break-word;
}
Tested in IE6, IE7, Firefox, Safari, Chrome
Continue reading Wrapping a long url with CSS
By default, jQuery thickbox plugin displays a thickbox overlay window when you click on a link which class is set to thickbox. The following code lets you display thickbox on page load without hacking anything in thickbox code.
<script type="text/javascript">
$(document).ready(function(){
tb_show(“Announcement”,”announcement.html?height=300&width=300″, “”);
});
</script>
Recommended Books on jQuery
jQuery Cookbook: Solutions & Examples for jQuery Developers
jQuery in Action
Continue reading Display thickbox on page load
HTML code:
<form action="login.php" method="post" id="login">
<fieldset>
<legend>Login</legend>
<label for="username" class="label">Username</label>
<input type="text" name="username" id="username" class="text" maxlength="30" />
<label for="password" class="label">Password</label>
<input type="password" name="password" id="password" class="text" maxlength="30" />
<input type="checkbox" name="remember" id="remember" />
<label for="remember">Remember me</label>
<input type="submit" name="submit" value="Login" />
</fieldset>
</form>
Javascript code:
The first javacript snippet will be used to store username and password into cookie if ‘Remember me’ checkbox is ticked.
The second javacript [...]
Continue reading Store login information in cookie using jQuery
It is not uncommon for a WordPress blog to display a list of all posts in an alphabetical order. I was using <?php wp_get_archives(‘type=postbypost’);?> to display all posts by post title but I couldn’t find a way to sort the post titles in an alphabetical order. After looking at the [...]
Continue reading A list of all posts in an alphabetical order
Hello! Welcome to Web development blog! My name is Ei Sabai and on this blog, I write about web development, mobile app development, latest web technologies and the likes. Read more 

