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

Comments Off

$(‘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

Comments Off

07 Apr, 2009

Back to top link with jQuery

Posted in: Snippets

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

25 Feb, 2009

Wrapping a long url with CSS

Posted in: CSS, Snippets

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

20 Feb, 2009

Display thickbox on page load

Posted in: Snippets

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

Profile PicHello! 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 about me or have a look at some of the tips & resources I've written.
Subscribe to our newsletter to receive tips, resources and special offers related to web development & design.
We do NOT spam.
Your name:  
Your email:  

Tips & Resources

Tips & Resources
WordPress Web Hosting
Recommended web hosting providers for WordPress 3.0
iPhone Native App Development
Important steps into iPhone app development for beginners
iPhone Web App Development
Tips for iPhone web app development
Coupons for Web Developers
Get discounts on web hosting, domain names, templates, etc
10 Useful jQuery Snippets
Easy-to-use jQuery snippets for any website
HTML Email Newsletter
Step-by-step tutorial on how to code an HTML email newsletter
  • bluehost Hosting $6.95/month
  • Joomla Templates