In most times, when you made gradients in Photoshop, there are some strokes that makes your gradient less attractive. A while ago I read somewhere how we can get rid of those strokes. I can’t remember where it was, but the filter in Photoshop I do remember because now I use it almost every time when I use a gradient.

-> Filter -> Brush strokes -> Spatter

Example:

NOTE: This filter works with rasterized and smart layers.

It totally despends on what screen you have. Those strokes are most visible on LCD and TFT screens. On CRT screens you won’t notice those strokes in most cases.

Do you use another way to solve this problem or do you have another tip that our reader may like? Please share it with us!

The number of mobile devices (smartphone’s and tablets) are growing fast, Apple has sold more than 8 million ipads, and more then 50 million iphones. Google OS called Android is also growing fast, there are more than 8 million android users.

The newest kind of mobile device is the tablet. This kind of device is gaining a lot of terrain now, so a lot of big companies have announced that they will come with there own tablet, which have a OS like Windows Phone 7 or a own OS.

So to help you design a nice GUI, i have created a list with some good and usefull Graphical User Interface (GUI) resources.

Apple Iphone

iPhone 4 GUI PSD (Retina Display)

iPhone Sketch Elements AI

iPhone UI Vector Elements

iPhone GUI Elements

iPhone GUI PSD Version 4

Fireworks toolkit for creating iPhone UI mockups

iPhone PSD Vector Kit

Mobile – iPhone

Google Android

Android GUI PSD

Google Android

Android 1.6 Wireframe stencil for Omnigraffle

Android GUI PSD v. 2.0

Android Sketch Stencil Version 1.0

Standard launcher icons

Google nexus one V2 Templates

Htc Dream

Htc Hero PSD

Google Nexus One template PSD

HTC G1 Dream Smartphone PSD

Apple Ipad

Apple iPad fully editable PSD

iPad Stencil for Omnigraffle

iPad GUI Kit in PSD Format

Free Apple iPad Icon Set for Your Website Designs

iPad GUI PSD

iPad Vector GUI Elements

Misc

Mobility: A free set of mobile UI design elements

RIM Blackberry PSD

All elements of the Maemo 5 GUI PSD

Stencils

iPhone Stencil Kit

Android Stencil Kit

iPad Stencil Kit

Resources

• Android
• Android Developers
• Apple developers tools
• Windows Mobile Developer Center
• Moblie Tuts+
• Mobile Love
• mac appstorm

Every month, i will choose a site that gets the title site of the month here on OpenSourceHunter. This can be an site of a freelancer, a usefull application/tool, a cool company, a site with great tutorials and resources, a blog, a site with a cool design or something else.

Tweetnest is a browsable, searchable and easily customizable archive and backup for your tweets. Ever thought to yourself that you wish there was some way you could take a look back and see what you tweeted around this time last year?

Or perhaps you remember that time you tweeted about that hilarious viral video, and now you can’t find it? Tweetnest will do the trick.

By installing Tweet Nest on your own web server,you now can: Archive your tweets, Backup your tweets, see your tweeted Media and Customize it!

Most browsers today support CSS3, this means that we can create and use cool looking buttons for our projects without the use of any images. But why use CSS3 buttons instead of an images? Well, you dont have to have any design skills(a lot of us dont know how to use a graphic program like photoshop), you dont have to buy graphic software(like photoshop, which isn’t cheap) and for websites with lots of buttons and high traffic it can reduce your server load(every image that you use is an HTTP request) but most of all it’s the future.

Do you know some better css3 buttons, please share theme with use!!

BonBon

Website | Demo

CSS3 Gradient Buttons

Website | Demo

Super Awesome Buttons with CSS3 and RGBA

Website | Demo

Creating the Perfect CSS3 Buttons

Website | Demo

Pretty CSS3 buttons

Website | Demo

Create a CSS3 Button That Degrades Nicely

Website | Demo

building beautiful buttons with css gradients

Website | Demo

Shiny Happy Buttons

Website | Demo

Creating Dynamic Buttons With CSS3

Website | Demo

Fancy Buttons Are Here

Website | Demo

10 Awesome CSS3 Buttons to use on your website

Website | Demo

CSS3 Box-Shadow with Inset Values

Website | Demo

Our first interview is with Reaper-media. Reaper-media is a web designer / developer from the UK who is well-known in the Envato marketplace community for his work in the flash based e-world chat and his job as an codecanyon forum moderator.

Q: Can you introduce yourself?

My name is Sam. Some of you may know me as Reaper-Media, or just Reaper. I’ve been interested in anything related to technology since I could crawl. I was forever pulling plugs out of sockets and getting tangled up in wires. A few years back I discovered this thing called web design. And have been hooked ever since. I love to develop on almost anything, and if there’s a platform/language I don’t know – I learn it.

Q: What was the first marketplace you visited and when was it?

I discovered ActiveDen (FlashDen Back Then) when I was doing my work experience, in the summer of 2008. I was amazed by the files that were on there, the talent and the effort that had gone into them just astounded me… so I had to sign up.

Q: You are a moderator on CodeCanyon. Why did you want to be a CodeCanyon moderator and not ActiveDen, where you sell your items?

I decided to apply for community moderator for both ActiveDen and CodeCanyon at the same time (I officially applied to become an ActiveDen moderator but I also noted my interest in CodeCanyon), I knew that I had a decent chance at getting the position due to the fact that I spent way too much time on the forums. I was interested in items from both the marketplaces, so I thought it couldn’t hurt to apply for both. I also currently in the process of developing items for CodeCanyon, as I’ve been developing my skills in php, html, css, js etc.

Q: What does your day consist of with the whole moderation factor?

Well CodeCanyon does not have the most active forum of all the Envato Marketplaces, so moderating the forums doesn’t put that much strain on my daily routine. To be honest, I probably don’t use the forums any more than if I wasn’t a moderator. I am all for the community, being a moderator only means I can help the community that little bit more effectively.

Q: You are a great Flash developer. When was the first time you started to use Flash and how did you discover it?

Firstly Thanks for the compliment. I first used flash about 5 years ago. I first discovered flash when I used to play flash games online, I just had to find out what you needed to create these awesome interactive works of art. So I did, I researched into it, started talking to mates at school about it, and that’s when an older friend told me he had a full license which he wasn’t using so he gave it to me. And I started experimenting, and that led onto what I know now.

Q: What motivated you to create E-world with Digitalscience? There are other chats for Envato members, what was the factor that made you create this application?

Well… I loved the first release of E-World (formerly Envato World), all it was at the time was a flash file which loaded the xml data of all the registered characters (which were submitted to digitalscience over email via a form). There were so many comments… many warmed to the idea of a big multiplayer game where users can walk around and chat etc. and the idea sort of died out. Then a few months back I started thinking about E-World, I thought I could turn it into something quite awesome, there could be mobile versions. It could be “the” chat room for marketplace users. The current chat rooms to be honest were not really up to scratch and seemed to die down quite easily. So I decided to contact digitalscience, and we re-started the project.

Q: Lastly, what is your tip for the beginner Flash developers and the new ActiveDen / CodeCanyon authors?

I’d say for anyone starting out at any of the marketplaces… just put something together and upload it… You probably won’t get accepted at first… but that’s actually a good thing. The reviewers criticizing your work actually makes you a better author. And another thing; just practice, practice, practice; you can never have enough practice. Try as many tutorials as you can find, http://www.gotoandlearn.com/ has some really good video tutorials for flash, and http://www.w3schools.com/ is perfect to start you out on other we technologies.

Thank you Sam for answering my questions! Good luck on CodeCanyon & E-world!

More an more sites are using(or going to use) JavaScript(library or plain) on there website(s). You probably dont see much of these javascript pieces, but one cool piece of JavaScript cant be missed, and it’s called a lightbox.

A JavaScript ligthbox is a fast growing way to present in a nice way an images or something else like inline html, video or an external site without opening a new window. In the old days most images(or other content) where presented in a new tab/window, which isn’t a pretty way to do this if you ask me.

There are a lot of JavaScript library available, so i included a couple of these library’s in this small list. Most of these scripts support all kind of content, just visit here website to see what kind of content they support(a lot of these scripts are updated frequently).

I have included jQuery, Mootools, Yahoo YUI, Prototype, Script.aculo.us and good old plain JavaScript.

jQuery lightboxes

jQuery Lightbox Plugin

Website | Demo | Javascript library: jQuery

Colorbox

Website | Demo(example4) | Javascript library: jQuery

Fancybox

Website | Demo | Javascript library: jQuery

ThickBox

Website | Demo | Javascript library: jQuery

Pirobox

Website | Demo(example1) | Javascript library: jQuery

Greybox Redux

Website | Demo | Javascript library: jQuery

PrettyPhoto

Website | Demo | Javascript library: jQuery

Interface Imagebox

Website | Demo | Javascript library: jQuery

nyroModal

Website | Demo | Javascript library: jQuery

FancyZoom

Website | Demo | Javascript library: jQuery

Shadowbox

Website | Demo | Javascript library: jQuery

Slightly Thickerbox

Website | Demo | Javascript library: jQuery

Lightbox for YouTube Videos

Website | Demo | Javascript library: jQuery

CeeBox

Website | Demo | Javascript library: jQuery

popeye

Website | Demo | Javascript library: jQuery

Mootools lightboxes

Slimbox

Website | Demo | Javascript library: MooTools

Videobox(video only)

Website | Demo | Javascript library: MooTools

Milkbox

Website | Demo | Javascript library: MooTools

Litebox

Website | Demo | Javascript library: MooTools

ImageZoom

Website | Demo | Javascript library: MooTools

ReMooz

Website | Demo(example1) | Javascript library: MooTools

mediaboxAdvanced

Website | Demo | Javascript library: MooTools

QuickBox

Website | Demo | Javascript library: MooTools

SqueezeBox

Website | Demo | Javascript library: MooTools

BumpBox

Website | Demo | Javascript library: MooTools

Prototype/Script.aculo.us

Lightview

Website | Demo | Javascript library: Prototype & Script.aculo.us

Lightbox2

Website | Demo | Javascript library: Prototype & Script.aculo.us

Lightbox gone wild

Website | Demo | Javascript library: Prototype & Script.aculo.us

Suckerfish HoverLightbox Redux

Website | Demo | Javascript library: Prototype & Script.aculo.us

WeebBox

Website | Demo | Javascript library: Prototype & Script.aculo.us

YUI

YUI lightbox

Website | Demo | Javascript library: YUI

PhotoViewer

Website | Demo | Javascript library: YUI

Lightbox for YUI 3

Website | Demo | Javascript library: YUI

Javascript

Lytebox

Website | Demo | Javascript library: JavaScript

Image Thumbnail Viewer

Website | Demo | Javascript library: JavaScript

Floatbox

Website | Demo | Javascript library: JavaScript

Tinybox

Website | Demo | Javascript library: JavaScript

TopUp

Website | Demo | Javascript library: JavaScript

Highslide

Website | Demo | Javascript library: JavaScript

After a lot of jQuery posts it’s time for an almost forgotten framework, Mootools. jQuery is more popular at this moment because it’s easier to use than Mootools, but Mootools is still a very powerfull javascript framework. Mootools is a good and useful framework but more for the javascript developer.

This collection of Mootools plugins contains some pretty cool and very useful stuff. A collection of Mootools menu plugins can be found here.

If you know some useful Mootools plugins please share theme with use and drop them in the comments below

FancyForm

FancyForm is a powerful checkbox replacement script used to provide the ultimate flexibility in changing the appearance and function of HTML form elements. It’s accessible, easy to use and degrades gracefully on all older, non-supporting browsers.

Website | Demo

Milkbox

Mootools lightbox clone.

Website | Demo

AutoGrow Textarea MooTools Plug-In

AutoGrow Textarea is a mooTools plugin that expands a textarea as the user types in text.

Website | Demo

Rabid Ratings

RabidRatings is a simple but eye-caching ratings system which allows users to your website to rate virtually anything. Installation is easy—simply tell the PHP script how to connect to your database and include the PHP tag where you want to have a ratable item, and everything else is done for you.

Website | Demo

SlideItMoo

SlideItMoo is a banner rotator, article spinner and image slider ( carousel ) developed with MooTools 1.2. Differences from the first version are the fact that the image slider now supports continuous sliding when navigating, offers the possibility to set how the slider will slide ( from left or from right ) when used with the auto slide feature on, offers the possibility to give it the item width ( width of the slider’s items ) and let it display the elements according to that width and the visible items parameter.

Website | Demo

RokSlideshow

RokSlideshow is a mootools powered JavaScript slideshow that allows you to quickly and easily display a selection of images and transition between them. The slideshow itself is very flexible and easily customizable and offers a great alternative to flash-based solutions.

Website | Demo

FormCheck

FormCheck is a class that allows you to perform different tests on form to validate them before submission.

Website | Demo

Mootools Slider With Two Knobs (Double Pinned Slider) with Range Indicator

Mootools Slider With Two Knobs (Double Pinned Slider) with Range Indicator.

Website | Demo

MooTools Auto Captioning Images

MooTools Auto Captioning Images.

Website | Demo

TableGear

TableGear is a software package for working with data on the web. It is designed get your data into a web page, and let you work with it quickly and easily, the way you would in powerful desktop applications like Excel.

Website | Demo

iPhone Checkboxes

One of the sweet user interface enhancements provided by Apple’s iPhone is their checkbox-slider functionality. Thomas Reynolds recently released a jQuery plugin that allows you to make your checkboxes look like iPhone sliders. Here’s how to implement that functionality using the beloved MooTools JavaScript framework.

Website | Demo

Rounded Corners

Creates rounded corners on divs.

Website | Demo

Moousture

A mouse gesture library written soley in javascript with power and flexiblity to mould itself for you. Implemented on Mootools following the Object Oriented standards. Library is aimed to set out a future framework for mouse guesters for any browser including modern mobile devices.

Website | Demo

mediaboxAdvanced

Based on Lightbox, Slimbox, and the Mootools javascript library, mediaboxAdvanced is a modal overlay that can handle images, videos, animations, social video sites, twitter media links, inline elements, and external pages with ease.

Website | Demo

Queued Photo Uploader

Don’t think that the uploader can handle only images! But since this showcase is called “Queued Photo Uploader”, the selectable file-types are limited to images. Check the showcase JavaScript shown under this paragraph for more options.

Website | Demo

Knoppr

An online image cropping tool for your website.

Website | Demo

mooSocialize

Based on ajax, this small widget allows to integrate many many bookmarks for every post on your blog, website etc. By clicking the mooSocialize button, a window will appear, which lets you choose your favorite network. Having a thumbnail of each service beside the link, it’s easy to see and find the one of your liking.

Website | Demo

If you are running a company or just working as a freelancer you probably know how important a good business card design can be, but there are still a lot of freelancers and company’s that dont have a (good) business card.

What kind of design is right for me? Well it depends mostly on you profession, for example a graphic designer would use a cool illustration and a photographer would use an simple but elegant design. But still the most important thing on the card is the information on it.

I have created a small list of cool and creative business card designs for those how dont have a business card or for those how are creating a new card. This list include some very good designs, also this list includes some none normal(paper) cards. I have included some really cool pvc/plastic, metal and creative shapes cards.

Paper Business cards

PVC Business cards

Metal Business cards

Creative Shaped Business Cards

Resources

Business card gallery’s

• Cardobserver
• Creattica
• Cardonizer
• Cardgala
• Cardview
• businesscarddesignideas

Business card tutorials

• Design a Print Ready Business Card for Designers
• Business Card Design Project Walkthrough
• Cardboard And Torn Paper Business Card
• Making a Print-Ready Business Card Using Only Photoshop
• Making a Grungy Business Card
• Design a print ready business card in photoshop

Business card templates

• GraphicRiver templates

Every month, i will choose a site that gets the title site of the month here on OpenSourceHunter. This can be an site of a freelancer, a usefull application/tool, a cool company, a site with great tutorials and resources, a blog, a site with a cool design or something else.

A couple of weeks back i came across a very cool website called behind the websites. This is an project of designer Ricardo Gimenes. Ricardo draws every couple of days a cool and funny illustration about a (well known) website/person. Go and see the cool illustrations that he has created so far!

Twitter is growing and our followers to, the number of nice and useful tweets are growing and because not everyone has a twitter account, or use it, i will hand pick every week a couple of tweets that gets my attention and share it here on OpenSourceHunter, because sharing is caring.

The best way to keep track of our tweets is simply to follow us on Twitter @opensourcehunte. Dont miss any of our tweets!

50 Awesome Website Design Galleries

11 Wordpress Plugins To Manage Your Ads Banners

The Right Frame of Mind: Applying the Lessons of CSS Frameworks

7 Essential Do’s & Don’ts of Website Navigation

12 Amazing and Creative Javascript Games

40 Amazing Minimalist Website Designs For Your Inspiration

Top 10 Free WordPress Frameworks for Designers

Create a Simple News Scroller Using Dojo

Create a Simple News Scroller Using Dojo

10+ useful code snippets to develop iPhone friendly websites

We’re pleased to announce that we finally have an freebee here at OpenSourceHunter. The first freebee that you can download for free here, are 208 fresh looking RSS feed and subscribe buttons. These buttons come in 13 colors, 4 types(feed, RSS, Subscribe and the RSS icon) and 4 versions(normal, pressed, normal with shadow and pressed with shadow). To make things even more easier, if you dont like the colors, created your own colors with the PSD files that are included.

Button Set Contents

• Number of buttons: 208
• Size: 120 x 34, 80 x 34, 34 x 34
• PSD included: Yes
• Format: .png

Please subscribe to our feed to get the download code!

If you are not an feed subscriber, but you still want to download this button set, please follow me on twitter and send me an message on twitter, and i will send you the download code!!

Small Preview

You can freely use these buttons for both your private and commercial projects, including software, online services, templates and themes. However, the set may not be resold, sub licensed, transferred or otherwise made available for use. In case you like the set, we would appreciate a link to this article in return, somewhere on your site/software or inside your themes description.

Download

Subscribe for online training by pass4sure and complete your PMI-001 certification with highest score. We also provide best training resources for N10-004 as well as EX0-101 exam preparation.

Twitter is growing and our followers to, the number of nice and useful tweets are growing and because not everyone has a twitter account, or use it, i will hand pick every week a couple of tweets that gets my attention and share it here on OpenSourceHunter, because sharing is caring.

The best way to keep track of our tweets is simply to follow us on Twitter @opensourcehunte. Dont miss any of our tweets!

Letterpress Text Effect Using Photoshop and CSS

11 Contextual Ad Alternatives To Google AdSense

24 Beautiful Web Designs Across the Color Spectrum

20 Creative Ads for your Inspiration

88 Tips to Make You a Productive Freelancer

Creative Illustrations by Daniel Conway

Incredible Examples of Superman Illustrations

How to Build a Lava-Lamp Style Navigation Menu

Best Of Textures: February 2010

Bokeh Effect in Web Design: Showcase, Tutorials and Resources

An ticket system (also issue tracking system, trouble ticket system, support Ticket or incident ticket system) is a computer software or web based package that manages and maintains lists of issues, as needed by an organization. Ticket systems are commonly used in an organization’s to create, update, and resolve reported customer issues.

There are 3 versions of tickets systems, paid version, custom version(mainly build for one company) and the open source version. Because we dont want to pay a lot of money for an ticket system, we use the open source versions.

These 9 ticket systems are professional ticket systems, and can be used in a big company. A couple of these ticket systems are even used by big company’s. I have just taken 9 good ticket systems that will do there job, but there are more great and professional tickets systems ticket available on the web.

OTRS

OTRS is an Open source Ticket Request System (also well known as trouble ticket system) with many features to manage customer telephone calls and e-mails. The system is built to allow your support, sales, pre-sales, billing, internal IT, helpdesk, etc. department to react quickly to inbound inquiries.

Website | Demo

os Ticket

osTicket is a widely-used open source support ticket system. It seamlessly integrates inquiries created via email, phone and web-based forms into a simple easy-to-use multi-user web interface. Manage, organize and archive all your support requests and responses in one place while providing your customers with accountability and responsiveness they deserve.

Website | Demo

Simple Ticket

Simple Ticket is designed to facilitate the support of our client’s computers and networks. It has been specifically designed for IT support companies who service multiple small business clients; however, it can easily be used by a company’s internal IT staff to support a single client with hundreds of users. The software was written using Ruby on Rails and boasts the latest features found in today’s rich web applications such as Ajax.

Website

eTicket

eTicket is a PHP-based electronic support ticket system that can receive tickets via email (pop3/pipe) or a web form. It also offers a ticket manager with many features. An ideal, easy to use and install helpdesk solution for any website. eTicket offers many features and can be easily skinned to the look and feel of your website.

Website | Demo

Trouble Ticket Express

The Trouble Ticket Express is a fully automated web based help desk. Written in Perl it can be easily installed on your website. Both Unix and Windows based servers are supported. Activate feature rich technical support email forms and attain complete control over your customer service operations.

Website | Demo

itracker

itracker is a true open source issue tracking system licensed under the LGPL license. itracker is built using Java enterprise technology. itracker is a professional, easy to use, open, easy to integrate, fast, modular, customizable and scalable solution for all kind of projects.

Website | Demo

Request Tracker

RT is an enterprise-grade ticketing system which enables a group of people to intelligently and efficiently manage tasks, issues, and requests submitted by a community of users. Written in object-oriented Perl, RT is a high-level, portable, platform independent system that eases collaboration within organizations and makes it easy for them to take care of their customers. RT manages key tasks such as the identification, prioritization, assignment, resolution and notification required by enterprise-critical applications including project management, help desk, NOC ticketing, CRM and software development.

Website | Demo

Jutda Helpdesk

Jutda Helpdesk is a Django-powered ticket tracking system for small enterprise, designed from the ground up to be easy to use.

Website | Demo

Mystic

Mystic is an open source trouble ticket system written in ruby on rails(RoR). It is designed to be fast, flexible and customizable. It also provides a simple, easy to use interface that’s quite intuitive. Tickets are used for several purposes, from internal project management, customer support/troubleshooting, reminders, and much more.

Website | Demo

What can really make you successful in your HP0-D07? Download 220-702 training kit by pass4sure and pass your 640-816 certification exam on time.

Twitter is growing and our followers to, the number of nice and useful tweets are growing and because not everyone has a twitter account, or use it, i will hand pick every week a couple of tweets that gets my attention and share it here on OpenSourceHunter, because sharing is caring.

The best way to keep track of our tweets is simply to follow us on Twitter @opensourcehunte. Dont miss any of our tweets!

Women’s Day Icons

Handy Tools and Tips for E-Commerce Websites

CSS In Depth: Margins, Padding & The Box Model

25 Examples of Incredible Ideas and Designs

Illustrations in Web Design: 50 Wonderful Examples

Sketching Resources for Industrial Designers

Principles to Become (and stay) Strong in the Search Engine Rankings

How to Create a Simple iTunes-like Slider

Quick Tip: How to use Google Analytics for Tracking in Flash

Unicode Characters for Class Names

WordPress is growing and growing, more and more people are building their sites on WordPress or they’re switch to this powerfull open source CMS tool. This means that the number of beautiful designs built on WordPress will grow.

I will present every couple of weeks a small list of beautiful designs built on WordPress as inspiration for you and promotion for the site owner(s). Do you have a beautiful design build on WordPress and you want to see your site here on OpenSourceHunter? Just drop me a line!

Mozilla Labs

Laboratories are where science and creativity meet to develop, research, and explore new ideas. Mozilla Labs embraces this great tradition — a virtual lab where people come together to create, experiment, and play with new Web innovations and technologies.

Visit this site

IconDock

IconDock is brought to you by N.Design Studio. We know your time is valuable, that is why we offer stock icons in vector and pixel format that you can quickly snap in your projects to speed up the development.

Visit this site

Raskulls

Raskulls is a bone-shakingly crazy action platformer to be released on Xbox Live Arcade in early 2010. Enjoy the adventures of the huge cast of mischievous characters in the single player Mega Quest, individual Grand Prix racing matches, and online around the world with Raskulls Multiplayer. Jump, fall, swim and bash your way through a massive variety of levels and enjoy every inch of the rich Raskulls world!

Visit this site

n.designstudio

N.Design Studio was founded by me, Nick La, a Toronto based illustrator and web designer. I am also the creator of the popular blog Web Designer Wall, Design Jobs on the Wall, IconDock, and Best Web Gallery. My main focuses are designing stock icons, illustrations, and beautiful CSS websites. My work has been featured in many online portals and design publications such as: Computer Arts, Web Designer, Practical Web Design, Digit, and Web Design Index.

Visit this site

Matt Mullenweg

Matt Mullenweg is the the founding developer of WordPress and the founder of Automattic, the company behind WordPress.com, Akismet, and more. He blogs at ma.tt.

Visit this site

X3 Studios

X3 Studios is an award-winning design studio, committed to excellence in all its forms.

Visit this site

WOW toys

WOW toys don’t require any batteries and still have amazing functions and features to discover. We only use high grade materials and every toy is rigorously tested to make sure it is durable and safe.

Visit this site

Dzucle

This is the personal blog and design portfolio of Dzuc, who lives in Hanoi, Vietnam.

Visit this site

h Mag

h MAG is a high end luxury magazine for the Hoboken market. We print 15,000 copies that are placed in every room at The W Hotel, delivered to every doorstep in town, distributed to over 100 retail establishments and handed out at the Path and Ferry stops.

Visit this site

TruSpeaks

This blog is a testament to what happens when you acknowledge your weaknesses, face you fears, and step outside of your comfort zone. You see, I have a problem with “sometimes”….my problem is quite simple really…sometimes I’m consistent and sometimes I’m not. Therein lies my problem. I am not a “writer” by trade i.e.~ school background, but I am a writer at heart. I love to write, but my punctuation… well, it will be flawless after some time passes with this blog.

Visit this site

Missed the other parts? Well you can find part 1 here, and part 2 here.

The testking HP0-D07 web designing course is the best place to learn latest trends in web designing. Download testking 642-642 wp tutorials and testking 350-029 demos to learn and create beautiful web designs.

Twitter is growing and our followers to, the number of nice and useful tweets are growing and because not everyone has a twitter account, or use it, i will hand pick every week a couple of tweets that gets my attention and share it here on OpenSourceHunter, because sharing is caring.

The best way to keep track of our tweets is simply to follow us on Twitter @opensourcehunte. Dont miss any of our tweets!

Design a Prettier Web Form with CSS 3

170+ Excellent Fresh Logos Inspirational Showcase

10 Basic Visual Web Design Mistakes

CSS Graphs And Charts: 11 Hand-picked Tutorials And Solutions

Adobe Font Finder

Why You Should Have A vCard And Examples Of Personal vCards To Inspire You

What’s the Next Step in a Freelancing Career?

Creating a Typographic Portrait in Pixelmator

5 Reasons Why I Love Being A Web Designer

Learning jQuery: Your First jQuery Plugin, “BubbleUP”

The use of the jQuery library is growing and growing(just released jQuery 1.4), more and more people are using this useful javascript library. This means that more and more useful jQuery tips, tricks and solutions are coming available. That’s why i created a small list of 26 cool and useful jQuery tips, tricks and solutions.

jQuery has a lot of very useful plugins that can help you with almost anything, but there are a couple of plugins that aren’t that smart to use, why? Well sometimes 1 or 2 lines of jQuery code can do the same thing(or even better), so why use a big script if you can do the same trick with a small piece of code.

As many of you already know, jQuery can do a lot of things in more than just one way, so if you see a tip, trick or solution and think/know this can be done better, smarter or faster please let me know, post and share it in a comment below of just email me this, so that i can use this for part 2.

1. Disable right-click

Disable right-click contextual menu.

$(document).ready(function(){
    $(document).bind("contextmenu",function(e){
        return false;
    });
});

2. Disappearing search field text

Hide when clicked in the search field, the value.(example can be found below in the comment fields)

$(document).ready(function() {
$("input.text1").val("Enter your search text here");
   textFill($('input.text1'));
});

	function textFill(input){ //input focus text function
 	var originalvalue = input.val();
 	input.focus( function(){
  		if( $.trim(input.val()) == originalvalue ){ input.val(''); }
 	});
 	input.blur( function(){
  		if( $.trim(input.val()) == '' ){ input.val(originalvalue); }
 	});
}

3. Opening links in a new window

XHTML 1.0 Strict doesn’t allow this attribute in the code, so use this to keep the code valid.

$(document).ready(function() {
   //Example 1: Every link will open in a new window
   $('a[href^="http://"]').attr("target", "_blank");

   //Example 2: Links with the rel="external" attribute will only open in a new window
   $('a[@rel$='external']').click(function(){
      this.target = "_blank";
   });
});
// how to use
open link

4. Detect browser

Change/add something for a certain browser.

Notice: As of jQuery 1.4, the $.browser variable is replaced by $.support.

$(document).ready(function() {
// Target Firefox 2 and above
if ($.browser.mozilla && $.browser.version >= "1.8" ){
	// do something
}

// Target Safari
if( $.browser.safari ){
	// do something
}

// Target Chrome
if( $.browser.chrome){
	// do something
}

// Target Camino
if( $.browser.camino){
	// do something
}

// Target Opera
if( $.browser.opera){
	// do something
}

// Target IE6 and below
if ($.browser.msie && $.browser.version <= 6 ){
	// do something
}

// Target anything above IE6
if ($.browser.msie && $.browser.version > 6){
	// do something
}
});

5. Preloading images

This piece of code will prevent the loading of all images, which can be useful if you have a site with lots of images.

$(document).ready(function() {
jQuery.preloadImages = function()
{
  for(var i = 0; i").attr("src", arguments[i]);
  }
}
// how to use
$.preloadImages("image1.jpg");
});

6. CSS Styleswitcher

Switch between different styles?

$(document).ready(function() {
	$("a.Styleswitcher").click(function() {
		//swicth the LINK REL attribute with the value in A REL attribute
		$('link[rel=stylesheet]').attr('href' , $(this).attr('rel'));
	});
// how to use
// place this in your header

// the links
Default Theme
Red Theme
Blue Theme
});

7. Columns of equal height

If you are using two CSS columns, use this to make them exactly the same height.

$(document).ready(function() {
function equalHeight(group) {
    tallest = 0;
    group.each(function() {
        thisHeight = $(this).height();
        if(thisHeight > tallest) {
            tallest = thisHeight;
        }
    });
    group.height(tallest);
}
// how to use
$(document).ready(function() {
    equalHeight($(".left"));
    equalHeight($(".right"));
});
});

8. Font resizing

Want to let the users change there font size?

$(document).ready(function() {
  // Reset the font size(back to default)
  var originalFontSize = $('html').css('font-size');
    $(".resetFont").click(function(){
    $('html').css('font-size', originalFontSize);
  });
  // Increase the font size(bigger font0
  $(".increaseFont").click(function(){
    var currentFontSize = $('html').css('font-size');
    var currentFontSizeNum = parseFloat(currentFontSize, 10);
    var newFontSize = currentFontSizeNum*1.2;
    $('html').css('font-size', newFontSize);
    return false;
  });
  // Decrease the font size(smaller font)
  $(".decreaseFont").click(function(){
    var currentFontSize = $('html').css('font-size');
    var currentFontSizeNum = parseFloat(currentFontSize, 10);
    var newFontSize = currentFontSizeNum*0.8;
    $('html').css('font-size', newFontSize);
    return false;
  });
});

9. Smooth(animated) page scroll

For a smooth(animated) ride back to the top(or any location).

$(document).ready(function() {
$('a[href*=#]').click(function() {
 if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
 && location.hostname == this.hostname) {
   var $target = $(this.hash);
   $target = $target.length && $target
   || $('[name=' + this.hash.slice(1) +']');
   if ($target.length) {
  var targetOffset = $target.offset().top;
  $('html,body')
  .animate({scrollTop: targetOffset}, 900);
    return false;
   }
  }
  });
// how to use
// place this where you want to scroll to

// the link
go to top
});

11. Get the mouse cursor x and y axis

Want to know where your mouse cursor is?

$(document).ready(function() {
   $().mousemove(function(e){
     //display the x and y axis values inside the div with the id XY
    $('#XY').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
  });
// how to use


});

12. Verify if an Element is empty

This will allow you to check if an element is empty.

$(document).ready(function() {
  if ($('#id').html()) {
   // do something
   }
});

13. Replace a element

Want to replace a div, or something else?

$(document).ready(function() {
   $('#id').replaceWith('
I have been replaced

');
});

14. jQuery timer callback functions

Want to delay something?

$(document).ready(function() {
   window.setTimeout(function() {
     // do something
   }, 1000);
});

15. Remove a word

Want to remove a certain word(s)?

$(document).ready(function() {
   var el = $('#id');
   el.html(el.html().replace(/word/ig, ""));
});

16. Verify that an element exists in jQuery

Simply test with the .length property if the element exists.

$(document).ready(function() {
   if ($('#id').length) {
  // do something
  }
});

17. Make the entire DIV clickable

Want to make the complete div clickable?

$(document).ready(function() {
	$("div").click(function(){
	  //get the url from href attribute and launch the url
	  window.location=$(this).find("a").attr("href"); return false;
	});
// how to use
home

});

18. Switch between classes or id’s when resizing the window.

Want to switch between a class or id, when resizing the window?

$(document).ready(function() {
   function checkWindowSize() {
	if ( $(window).width() > 1200 ) {
		$('body').addClass('large');
	}
	else {
		$('body').removeClass('large');
	}
   }
$(window).resize(checkWindowSize);
});

19. Clone a object

Clone a div or an other element.

$(document).ready(function() {
   var cloned = $('#id').clone();
// how to use


});

20. Center an element on the screen

Center an element in the center of your screen.

$(document).ready(function() {
  jQuery.fn.center = function () {
	  this.css("position","absolute");
	  this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
	  this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
	  return this;
  }
  $("#id").center();
});

21. Write our own selector

Write your own selectors.

$(document).ready(function() {
   $.extend($.expr[':'], {
       moreThen1000px: function(a) {
           return $(a).width() > 1000;
      }
   });
  $('.box:moreThen1000px').click(function() {
      // creating a simple js alert box
      alert('The element that you have clicked is over 1000 pixels wide');
  });
});

22. Count a element

Count an element.

$(document).ready(function() {
   $("p").size();
});

23. Use Your Own Bullets

Want to use your own bullets instead of using the standard or images bullets?

$(document).ready(function() {
   $("ul").addClass("Replaced");
   $("ul > li").prepend("‒ ");
 // how to use
 ul.Replaced { list-style : none; }
});

24. Let Google host jQuery for you

Let Google host the jQuery script for you. This can be done in 2 ways.

//Example 1



 // Example 2:(the best and fastest way)

25. Disable jQuery animations

Disable all jQuery effects

$(document).ready(function() {
    jQuery.fx.off = true;
});

26. No conflict-mode

To avoid conflict other libraries on your website, you can use this jQuery Method, and assign a different variable name instead of the dollar sign.

$(document).ready(function() {
   var $jq = jQuery.noConflict();
   $jq('#id').show();
});

Resources

• jQuery
• jQuery UI
• 14 days of jQuery
• Learning jQuery
• Improve your jQuery – 25 excellent tips
• Cheatsheet jQuery 1.1.3
• Cheatsheet jQuery 1.2
• Cheatsheet jQuery 1.3
• Cheatsheet jQuery 1.3.2
• Cheatsheet jQuery 1.4

If you are looking for JN0-303 help, then you should opt for braindump written and organized by certified experts to help you pass 642-975 on time in single effort.

Every month, i will choose a site that gets the title site of the month here on OpenSourceHunter. This can be an site of a freelancer, a usefull application/tool, a cool company, a site with great tutorials and resources, a blog, a site with a cool design or something else.

The second site of the month is todoTweet. todoTweets is a simple free task manager for your tweets. todoTweet helps you use your Twitter account to track and manage tasks. todoTweet takes all the tweets from your twitter account with #todo and creates a clean and easy to use to-do list.

Do you know a site, for the site of the month, go to the contact page and send us an email about this site, use the subject “site of the month” and if the site is interesting enough it could be the next site of the month.

Twitter is growing and our followers to, the number of nice and useful tweets are growing and because not everyone has a twitter account, or use it, i will hand pick every week a couple of tweets that gets my attention and share it here on OpenSourceHunter, because sharing is caring.

The best way to keep track of our tweets is simply to follow us on Twitter @opensourcehunte. Dont miss any of our tweets!

50 Awesome Website Design Galleries

Notepad – WordPress theme

7 Operating Systems You Probably Never Heard Of

How to Code up a Web Design from PSD to HTML

20 HDR Storm Chasers

35 Amazing Stationery Pack Designs

Design a clean business layout in Photoshop

30 Glamorous Windows 7 wallpapers for your PC

40 Fundamental Illustrator Tutorials You Must Know

Make your MooTools Code Shorter, Faster, and Stronger

I created a v-card template a couple of weeks back, which had a simple but cool logo animation by using just 2 images and a small piece of jQuery code. Afther a lot of emails asking me how to create this simple but cool animation i decided to share this in a simple and basic tutorial.

A couple of years back you would use an animated gif or Flash for an animation like this one, but with some little help of jQuery this can be done very easy and quick.

Tutorial Details

• Program(s): Adobe Photoshop, Adobe Dreamweaver
• Difficulty: Easy
• Estimated Completion Time: Less then 45 minutes

The first image

Open your Photoshop and create a new document. I have taken the dimensions 500px by 120px for this tutorial. You can fill Use the type tool to create the word HELLO or some other word. I have used the font Arial Black. This font is bold and present on every computer so perfect to use for this example. You can see the font setting on the screenshot below.

Now add a new layer and call this one result and fill this layer with the color #29b0b1 by using the bucket tool, this layer must be on top. Now select the result layer and select the outline of the typo layer by holding CTRL and click on the thumbnail in the layers panel. We have no selected the word HELLO

Once you have selected the word HELLO you can press delete and you should have the same result as below.

Now delete the background layer and the typo layer, and you should have a see true the image. Save the image and call it frame.png, be sure that you save this as a png extention, because the backgrond has to be transparent.

The second image

Create an new photoshop with the dimensions 500px by 500px. Use the the rectangle tool(u) to create a shape and call this layer ani bg. Choose the color #ffffff. Select the pen tool and select the Add Anchor Point Tool. Once selected hold CTRL and click with the pen on the border of this shape to select the anchor points. Now you can add a anchor point some where you like, and shape it to the shape you like. The example that is have use for this tutorial looks like this.

The code

Open your Dreamweaver or other editor and create a html file.

Html

As you can see there are 2 images in this div, but one is positioned outside the box.

CSS

body{
	background:#29b0b1;
}
.logo{
	width:500px;
	height:120px;
	float:left;
	overflow:hidden;
	position:relative;
}
.ani-bg{
	position:absolute;
	top:-500px;
	left:0;
}
.frame{
	position:absolute;
	top:0;
	left:0;
	z-index:1!important;
}

As you can see has the .frame an z-index attribute, this means, it’s on top of the other image. The logo div has a overflow hidden, this means that the ani-bg.png image will not be displayed outside the logo div. Basic and simple.

Javascript/jQuery

$(document).ready(function(){
	$(".ani-bg").animate({
		marginTop: "420px"
	}, 2500 );
});

Before using this piece of code you have to download and add the jQuery libiray in to your html file. Download it here. I have used 1.3.2 for this tutorial, but you can use all version of jQuery for this effect.

I have used the animation effect for this tutorial, this is a very simple but still very useful effect. This piece of code will animate the hidden ani-bg.png from the top to the bottom(from -500px till 420px), which it will be visible. You can change the speed of the animation, i have set this example on 2500 milliseconds.

I have used the margintop for this tutorial but you can use an other direction/position, for example you can use a marginleft as you can see in this demo.

You can create a lot of cool effect this way, so go a head and give it a try!

Passing 646-363 exam is not difficult if you have right resources. pass4sure offers you incredible online training for 642-982 and 642-373 exam with 100% pass guarantee on first time.