yensdesign – Tutorials, Web Design and Coding

Daily free tutorials about web design, coding, jquery and more

Posts Tagged ‘fast’

Fast Tip: Breaking events propagation in Javascript

Friday, December 19th, 2008

An important feature of Javascript you must know is the events propagation. This what makes is trigger all events to the parents when a child event is captured (like a bubble). So, if you click in a div element, the click will active the onclick event in the div parent, and in the grandparent… and so until the body element.

This can often be helpful, but many others can be a big trouble. Of course you can disable this feature with the code below:

[code language="Javascript"]
/*DISABLE EVENTS PROPAGATION*/
//IE
if(!e)
	window.event.cancelBubble = true;

//OTHER NAVIGATORS*
else if(e.stopPropagation) e.stopPropagation();
[/code]

You can view a little example so that you can see it in action after the break.

Tested in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.

(more…)

Fast Tip: Show or hide text in a search box with focus / blur

Thursday, December 18th, 2008

Currently the search boxes are in the most of websites because the content is growing continually and it’s useful find out something with a simple search. In order to provide them more interaction I want to show you a simple but very useful javascript code snippet to show or hide the default contained text in a search box managing the events focus and blur.

So if we have this html input text box:

[code language="html"]

[/code]

The javascript code that you must put before closing the body element would be:

[code language="html"]



[/code]

The jQuery code would be as follows:

[code language="javascript"]
$(document).ready(function(){
	$("#txtSearch").blur(function(){
		if(!$(this).val()) $(this).val("Search the web...");
	});
	$("#txtSearch").focus(function(){
		if($(this).val() == "Search the web...") $(this).val("");
	});
});
[/code]

And that’s all guys, I hope you can use it for your search boxes and thanks for visiting us! We had a huge quantity unique visitors yesterday and it seems that today will be better :D

Fast Tip: How to cancel right click context menu in jQuery

Friday, December 12th, 2008

Hi there guys! While I was working in the next tutorial I have been encountered with a problem: How can I block / cancel the context menu when I do right click on the screen?

There are a lot of examples and scripts in javascript, but one more time jQuery makes it easy! Here you have the code:

[code language="javascript"]
$(document).ready(function(){
	$(document).bind("contextmenu",function(e){
		return false;
	});
});
[/code]

This code works in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.

One more thing guys… the next tutorial will be released on next Monday as a part of serie of tutorials that will be very very BIG, interesting and useful :)

See you soon!

Fast Tip: Create your personal blog to promote your self

Sunday, November 23rd, 2008

Hi there guys! With this entry I will try to create a new category for yensdesign called “Fast Tips“. It is about my personal thoughts and experiencies from last years that I hope it will be useful on your projects.

Last 2 years I spent my time thinking about how to get freelance work around the internet without results. Only a few projects came to me and it isn’t enough for a guy that expected live with freelance work, you know. It was really very frustrating, I wanted to work hard for freelance works but nothing happened.

Maybe I was not good enough? I don’t think so, I always trusted in hard work and in my own qualities but when things aren’t as one expects, everything looks like a sh*t and your desire to work hard and you ideas disappear. But you guys should not stop your desire to work to achieve you personal goals.

Here you have my solution: Create you personal blog is the best way to promote yourself.

Creating you personal blog allows you to show to all you works and skills in your field. Would you hire someone without seen his work before or not knowing nothing about him? I don’t think so, so just letting people know more about you and your work is the best way to get clients in freelance work.

I tell you that because now that I am trying to write my personal blog over here at yensdesign.com, people is asking me about freelance work because they enjoyed some tutorials that I have written. It’s really funny that now that I am not looking for freelance work (because I am trying to create my personal project) it appears for me and not when I was looking for :D .

I was wrong, but you guys are in time to create you own blog to promote yourself showing to all how you are and your skills. Just do it!