Image Tagging Tutorial Using jQuery and CSS

Posted in Coding, JS & AJAX, Tutorials2 years ago • Written by 10 Comments

There is a popular saying that a picture is worth a thousand words. Images are a great way of catching our attention instantly. But sometimes its necessary to tag or link specific parts of images to provide information. Popular social media giants like Facebook and Google Plus use image tagging to identify the people and places in images.

In this tutorial I am going to show you how to create a simple image tagging system using jQuery and CSS. Lets get started.

Image Tagging Tutorial Using jQuery and CSS Read More

35 Excellent jQuery and CSS3 Navigation Menus

Posted in Coding, HTML & CSS, JS & AJAX2 years ago • Written by 14 Comments

Navigation is one of the most important elements of web design. Poor navigation will always take away from great content. Good navigation must possess both aesthetics and usability. That’s where jQuery and CSS3 navigation menus come handy.

With the features and customization level that jQuery and CSS3 offers, you can easily create the perfect navigation for your website. Yet it’s kind of difficult if you aren’t familiar with these. Fortunately there are people who have already written the code for you.

For this roundup we’ve prepared 35 fresh (most of them are from 2012), beautiful and straight away usable jQuery and CSS3 navigation menus. All you have to do is customize them for your specific needs!

35 Excellent jQuery and CSS3 Navigation Menus Read More

Quick WordPress Theme Switcher Plugin Tutorial

Posted in Coding, JS & AJAX, PHP, Tutorials2 years ago • Written by 9 Comments

The design or theme of a website plays a vital role in its success. Recent changes in popular sites prompted me to write this tutorial. Facebook Timeline, Youtube Dark Theme and Gmail Clean and simple design are major changes made recently. Also 1stwebdesigner is going through its redesign process and the changes looks promising from a users perspective.

In this tutorial I am going to explain how you can dynamically switch WordPress themes based on various conditions allowing you to provide the best possible user experience. Before we dig into dynamic theme switching, let’s see how WordPress changes its menu in the admin dashboard.

Quick WordPress Theme Switcher Plugin Tutorial Read More

Create a Jigsaw Puzzle Using jQuery and PHP

Posted in Coding, JS & AJAX, PHP2 years ago • Written by 16 Comments

Almost everyone, at one point during childhood, has played jigsaw puzzles. Today I am going to show you how to create a jigsaw puzzle using jQuery and PHP.

Lets start creating puzzles. I know that you must be waiting to see the puzzle in action. I am not going to keep you guessing. Here is the sample demo of the puzzle and download of tutorial files.

Now you got your wish. So lets move onto creating the puzzle.

Create a Jigsaw Puzzle Using jQuery and PHP Read More

Creating Stunning Visualizations with Impress.js

Posted in Coding, HTML & CSS, JS & AJAX, Tutorials2 years ago • Written by 11 Comments

Do you want to create beautiful slideshow presentations for the web using just HTML and CSS? That won’t be a problem with Impress.js, a powerful CSS3 transformation framework that lets you convert your HTML content into a slideshow with amazing effects.

Impress.js is a jQuery plugin created on github by bartez which uses CSS3 functionality to create presentations. All the modern browsers will support the stunning visualizations created by Impress.js.

Creating Stunning Visualizations with Impress.js Read More

jQuery Mobile – What You Need to Know

Posted in Coding, JS & AJAX, Tutorials3 years ago • Written by 17 Comments

jQuery Mobile version 1.0 finally launched this past November. Don’t know if you heard about it, but if you are planning to do any mobile app or website development, it’s better to get started with it right now.

I’m sure you’ve heard about jQuery. So, its mobile version is pretty close to what you already are used to, but with a lot of enhancements for mobile screen events (like touching instead of click, and there is no hover) and browsers (this one is tricky since there are plenty of browsers and devices out there) and capabilities (pluggable components).

The crazy thing is how simple it is to initiate and build a fully working mobile site. Actually, we’ll be talking about concepts, tips, codes, and in the meantime you can build your own app, in no more than one hour. Yeah, noob to ninja in one hour, this is what you’ll get here :)

So, let’s rock!

jQuery Mobile – What You Need to Know Read More

Mouthwatering Collection Of jQuery Plugins And CSS3 Tricks

Posted in Coding, HTML & CSS, JS & AJAX, Plugins3 years ago • Written by 7 Comments

I’m sure that at one point or another you were designing a website and thought it could use a little something extra. That bit of something that adds extra functionality or enhances what it already has, making it not only easier for the user to receive the information they seek, but also present it in a neat package.

In no particular order, I give you a handpicked collection of jQuery plugins and some CSS3 tricks to top it off. Surely, with these in your designer arsenal, your creations will stand out more than ever before.

Mouthwatering Collection Of jQuery Plugins And CSS3 Tricks Read More

Simon’s Google Doodle – HTML5 + JS jQuery Game

Posted in Coding, HTML & CSS, JS & AJAX3 years ago • Written by 24 Comments

Dude, you’ve heard a lot about Google doodles haven’t you? What about that Pacman one? It is just addictive. Company owners know how a funny game and unlimited search powers could be dangerous for productivity. And how it can be a marketing boost. The most amazing thing is that we can create our own addictive HTML game. Actually, this is why we are here today. With this tutorial you’ll see how to use some of JavaScript and HTML capabilities to build simple yet funny games.

So, let’s rock!

Simon’s Google Doodle – HTML5 + JS jQuery Game Read More

jQuery Plugin Development: Hover to Reveal Masked Password

Posted in Coding, HTML & CSS, JS & AJAX3 years ago • Written by 17 Comments

We talked about how to improve your HTML forms performance a couple of days ago. There we covered a pretty controversial topic “Don’t mask your passwords”, discussing how bad masking your passwords could be for usability.

At this moment, we basically have two options: mask password field and don’t ask for any feedback, or show password field as text and potentially decrease security.

This is why I think a hover revealing password could be a really good alternative: You can increase your security, and if you are unsure about what you’ve typed just go and hover over it.

So, what we will be doing today is a jQuery plugin to do that, and additionally, we will have a behavior pretty similar to what many mobiles does, where we can see the last character for a couple of seconds. This is a good chance to learn more about plugins, dynamically generated content, and some good coding practices.

Moreover with this technique we could apply different effects and a lot of variations since all this things are based on non-obtrusive and almost only decorative javascript.

So, let’s rock!

jQuery Plugin Development: Hover to Reveal Masked Password Read More

50 New And Crazy Cool jQuery Plugins From Year 2011

Posted in Coding, JS & AJAX, Tools, Web Design3 years ago • Written by 24 Comments

With 2011 a little over half over it’s the right time to look at, and uncover, the current trends of web design and development. It’s sure been a helluva ride for jQuery and it’s growth just doesn’t stop. With more than 40% of websites using jQuery now it’s no longer possible to ignore this efficient, powerful and lightweight tool.

jQuery gives developers the chance to enrich websites with amazing elements without the need to write dozens of lines of code. This article presents 50 advanced, cutting-edge yet simple jQuery plugins that will enhance your web experience drastically.

50 New And Crazy Cool jQuery Plugins From Year 2011 Read More
54.237.32.10 - unknown - unknown - US