• Home
  • About Us
  • Contact Us
  • Guest Post
  • Submit News
  • Hire Me
  • Advertise
rss

skyje

  • Articles
  • Design
  • News
  • Social
  • Tutorials
  • Twitter
  • Wordpress
Browse: Home » Tutorials » 22 Excellent JQuery and CSS Tutorials

22 Excellent JQuery and CSS Tutorials

Published June 8, 2010 in Tutorials | 3 Comments »


  
Tweet

JQuery and CSS are evolving and reaching new levels of quality and interactivity. Jquery produces extremely smart and professional features without the need of any animation ability. The opportunity arises to use these elements to enhance Design. In all, CSS and Jquery will always have their place within the market of Web Design for the time being. In this post you will find a huge collection of Jquery and CSS tutorials.These tutorials are useful and unique, so you will learn some new techniques that you can use in your next projects.

Simple “Call To Action” Button With CSS & jQuery

create an effective and awesome call to action button with some CSS and jQuery that grab the user’s attention and entice him to click .

jQuery & CSS Example – Dropdown Menu

Dropdown menus and menu bars have been heavily used since the early days of graphical user interfaces. Their use has become ubiquitous, and even expected, in desktop applications, and the web has quickly followed suit. This article is intended to describe an extremely basic, yet extremely powerful, technique for adding dropdown menus in your application user interface or website design.

How to Create a Drop-down Nav Menu with HTML5, CSS3 and jQuery

In this tutorial, we’ll take a look and see what we can achieve with HTML5 and CSS3 when it comes to the staple of current web sites: the humble drop-down navigation menu. We’ll also use jQuery to handle the effects and add the finishing touches for us.

A Fancy AJAX Contact Form

Providing a simple and reliable means of feedback from site visitors is a crucial part of any web presence. The most simple and common feedback channel are contact forms.

Easy Display Switch with CSS and jQuery

Go over a quick and simple way to allow your users to switch page layouts by using CSS and jQuery.

Build a Tabbed Box with CSS and jQuery

This article will show you how to take the tabbed box from Photoshop to XHTML and CSS, and how to apply the basic jQuery functionality to make the tabs operate.

Create a better jQuery stylesheet switcher

Style Sheet switchers (or “colour theme choosers“) are not really that new. Apart from that fact, they still are pretty fun to use and cool to see.

Neon Text Effect With jQuery & CSS

neon text effect

Twitter like Login Box with Jquery & CSS

This tutorial shows a smarter way of dispalying login box in your web application. It is just similar to Twitter login box. The script is absolutely simple and easy to understand.

Inline Modal Window w/ CSS and jQuery

Inline Modal Window w/ CSS and jQuery

jQuery & CSS Sprite Animation Explained In Under 5 Minutes

create an entire animated scene using jQuery, CSS & Sprites. You’ll also get to see some pretty cool out-in-the-wild examples of jQuery Sprite Animation in action.

Facebook Like Alert/Popup Box with Jquery & CSS

Facebook like popup/alert box is primary choice of all web developers to show messages to their users. Although it seems a difficult task but a little CSS and Jquery can ease your life a lot.

Create an Image Rotator with Description (CSS/jQuery)

An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.

Create a Simple CSS + Javascript Tooltip with jQuery

Simple and easy way to create a javascript tooltip with jQuery. I break it into several sections: getting the mouse xy axis, anchor tag structure, how to hide default TITLE tooltips, css plus rounded corners box and the final working demo.

Horizontal Scrolling Menu made with CSS and jQuery

There are a lot of cool flash scrolling menus out there, but I decided to make a similarly looking menu with just CSS and jQuery. I couldn’t achieve the same smoothness in animation, but anyway I’m really satisfied with the result. My menu works fine in all major browsers and degrades gracefully when Javascript is turned off.

Horizontal Subnav with CSS & Jquery

Smart Columns w/ CSS & jQuery

The great thing about having fixed columns in a liquid layout, is that it will fill up the view port with as many columns as it can fit. But as you can see there will be certain viewport resolutions, where it leaves excess white space where a column was just not able to squeeze in.

Create Vimeo-like top navigation

I really like the top navigation implemented on Vimeo.com. First time I saw it I wanted to recreate it. And this is exactly what I am going to do in this tutorial.

Designing the Digg Header: How To & Download

The design of Digg is full of smart ideas. The site identity is strong but doesn’t take up too much valuable vertical space. Navigation is compacted with the use of simple drop-down menus.

Making a Photoshoot Effect With jQuery & CSS

Photoshop effect

Sliding Jquery Menu

Create a sliding menu button using jquery. You can see the effect in action over on the PSDtuts webpage in the top right hand corner.

Create a Slick Tabbed Content Area using CSS & jQuery

Build a simple little tabbed information box in HTML, then make it function using some simple Javascript, and then finally achieve the same thing using the jQuery library.

Tags: CSS, css tutorials, jquery, jquery plugins, jquery tutorials, web2

Written by skyje

Skyje is a Social Networking blog for Designers and Developers.We also interested in Wordpress,Twitter and Seo.You can Fellow us on Twitter and Subscribe

  • Delicious
  • Facebook
  • Stumble
  • Twitter

3 Comments

3 Responses to “22 Excellent JQuery and CSS Tutorials”

  1. Eric Says:
    June 12th, 2010 at 4:41 am

    Thanks a lot for posting these. Definitely found some useful resources here. The animation tutorial is awesome. Keep up the good work!
    Eric´s last blog ..How can I gain interest in my project from Venture Capitalists?My ComLuv Profile

  2. Dayna Fick Says:
    July 14th, 2010 at 2:42 pm

    Great post. I’ve been using JQuery more frequently. It offers so many options that are easy to use and modern looking.

  3. PSD to CSS Says:
    July 23rd, 2010 at 5:34 am

    I appreciate this excellent JQuery and CSS tutorials.Thanks.

Leave a Reply

CommentLuv Enabledshow more

Subscribe

email subscriberss subscribeTwitterdelicious

Advertise on Skyje

User News

  • Tips to Improve Your Design Blog
  • Blogging has become the most important and widely used tool of new media technology. The concept has, once again, enabled the Internet to become a two way communicating medium. Since …

  • The new Digg, take advantage of it without losing your mind
  • On this quick review, we will study the main differences among the old and the new Digg as well as the new features and options, like yourselves, we are still …

  • 80+ Breathtaking Nature Inspired Photos
  • If you are feeling bad or just tired by the hard work so you have no need to be feel like that anymore because the photos we are going to …

  • Color Theory in Web Design : Blue Color Scheme
  • This article is dedicated to color theory and the use of colors in web design. Whether you are a designer or blogger who needs ideas for a color scheme …

  • 60+ Free Creative Photoshop Brushes Sets
  • Today we are sharing 60+ Free Creative Photoshop brushes sets which are compiled from different web resources, I strongly hope that this collection would be helpful for you to enhance …

Submit News More News Feed
  • Popular Posts

    • CSS Sprites
    • Logo Design
    • Modern Web Design
    • Mootools Examples
    • Online Drawing Tools
    • photoshop custom shapes
    • WordPress Job Board
    • WordPress Jquery Plugins
    • WordPress Pagination
    • WordPress Resources
  • Friends

    • BestDesignTuts
    • Creative Overflow
    • designfollow
    • PSD to HTML
    • PSD to Wordpress
    • socialh
    • UnderWorldMagazines
  • Recent Posts

    • All Hail the Nike Logo! Artistic Derivatives Using the Swoosh
    • Should You Opt for Cheap Web Hosting?
    • Yellow Logo Roundup
    • How to improve your website’s design in 7 simple steps
    • When Design Becomes Intrusive
    • Great tips to win more projects as a freelancer
    • 9 Best Twitter Jquery Plugins
    • Modernism to the CSS layouts: What is it all about?
    • Logo design company LogoBee essential to starting businesses
    • Animal Logos: A New Approach to Logo Design
    • Learn A-Z of WordPress Plugins – Beginner’s Guide
    • 16 Great Mootools Examples and Tutorials
    • LinksAlpha Plugin Tops Facebook Like button. Adds 1-click to Retweet and Facebook Share
    • Great Backup Plugins & services & Online Storages For WordPress
    • 22 Excellent JQuery and CSS Tutorials
  • Guest Post

    We look for authors and guest writers here at skyje. We’d be delighted to publish your post here for more info Click Here
  • Recommended

    • Virtual Dedicated Server
  • Recent Comments

    • freeallsoftwares on Great Backup Plugins & services & Online Storages For WordPress
    • indonesia news on Google News Interesting Reads
    • Logo Design Canada on Animal Logos: A New Approach to Logo Design
    • SEO Services on 26 rss feed icons collections
    • Jacob on How to improve your website’s design in 7 simple steps
    • Home
    • Jobs
    • About Us
    • Contact Us
    • Guest Post
    • Submit News
    • Hire Me
    • Advertise