Posts Tagged ‘jquery’

jQuery Tabs Tutorial

December 26th, 2012 Leave a comment
jQuery Tabs Tutorial

jQuery tabs on content have become a stylish addition to Web 2.0 websites, but it’s not always obvious just how to make them work, and many people have been writing up tutorials on how to write your own tab scripts using jQuery. Thankfully, however, there’s an addition to jQuery called jQueryUI that includes tab support and pre-built tab functions so you don’t have to roll your own every time you write a website. Here’s a quick tutorial on how to get them up and running on your website! Method A: The Conventional Way jQueryUI now supports tabs as part of its integrated… View full post »

jQuery Tutorial: Scrolling Effects With Anchor Links

December 20th, 2012 Leave a comment
jQuery Tutorial: Scrolling Effects With Anchor Links

Sometimes you’ll want to use anchor text in a page, but you don’t want any old boring anchor scroll. The instant click-through to anchor links is devoid of any interesting flair, and that’s no longer a viable option in today’s Web landscape. Web 2.0 is all about having smooth effects to go with your buttons and bevels, and so maybe you want a cool scrolling effect for your anchor links on your site. Here’s a quick and easy way to get that on your page! Step 1: Create The Anchor Link You’re going to want this in the part you want to… View full post »

Is jQuery Right For Your App?

December 17th, 2012 Leave a comment
Is jQuery Right For Your App?

jQuery has taken over in the application-building world, and people have been using it left and right to build new applications, from hobbyist projects to large-scale, enterprise-level applications. There are, however, other toolkits like dojo out there that offer alternatives to jQuery: should you always use jQuery, or is there a reason to switch to one of those other toolkits when the need arises? First off, it’s always a safe bet to use what you know. If you’re familiar with the jQuery library, it’s almost certain that you’re going to do faster, better work with jQuery than you would with another… View full post »

Creating a Simple Drop-Down Menu with jQuery

October 10th, 2012 Leave a comment 1 comment
Creating a Simple Drop-Down Menu with jQuery

If you have learned anything about JavaScript, it is most likely that you have heard about jQuery. jQuery is a powerful tool for creating dynamic effects with JavaScript and can be used with CSS to create many different kinds of navigation systems on your Web sites. In this article, I will show you how to create a drop-down menu using jQuery and CSS. Creating the HTML First, we create the HTML for the menu structure. We will use <div> tags with the HTML list tag <li> to create the top level and submenu items. <div class="menu"> <a class="links" >My… View full post »

Using the jQuery Animate Function

August 31st, 2012 Leave a comment
Using the jQuery Animate Function

When making interactive or interesting Web pages, it is helpful to have a way to create animations that do not require special plug-ins or add-ons. The JQuery animate() function is a powerful tool that you can use on HTML elements that is supported by most major browsers without having to have extra pieces to install. Using the animate() function is easy to learn even if you are new to JQuery. To begin, let’s look at the syntax for the animate() function. There are two different ways it can be called: .animate(properties, [duration], [easing], [callback] ) Here is a breakdown of… View full post »

Create an Accordion Menu with jQuery

August 27th, 2012 Leave a comment
Create an Accordion Menu with jQuery

jQuery is an open-source library that you can use to create animations, advanced effects and dynamic web pages. It is also a great way to add items such as menus to your site that incorporate some of these effects. In this article I will show youhow to use jQuery effects with your HTML interface and then how you can use those effects to create an accordion menu with animation that toggles to open sub-menu options. This is an excellent addition to your site that is easily within the grasp of someone new to jQuery. Using Visual Effects with… View full post »

A Sliding Navigation Menu with jQuery

August 1st, 2012 Leave a comment
A Sliding Navigation Menu with jQuery

As you probably know, jQuery allows us to create different navigation effects that can make our pages look polished and professional. In this article, I will show you how to create a bottom sliding navigation bar that uses some CSS3 and jQuery effects. If you would like to use this code in your own pages, you can follow this tutorial or download the zipped code files to have a starting point that you can use on your own site. The Markup In the HTML we simply need to set up the structure of our menu, creating headings and sub-menu items…. View full post »

jQuery HTML5 Drag-and-Drop File Upload

March 8th, 2012 Leave a comment 3 comments
jQuery HTML5 Drag-and-Drop File Upload

Often we have a situation on our site where we want users to be able to upload a file. Whether this is for a profile, pictures of any item or other scenario, creating a file upload doesn’t have to be tricky. With some of the nice tricks in HTML5 and jQuery we can even add the nice touch of being able to drag and drop files directly into the uploader, making your site feel extra-special. In this tutorial we will discuss the techniques of both of these techniques that make this trick possible as well as create… View full post »

5 Helpful jQuery Tricks

February 21st, 2012 Leave a comment 1 comment
5 Helpful jQuery Tricks

It doesn’t matter if you are just starting out with jQuery or have been working with it for a while; you probably have some magic in your bag that you reuse in your projects. If you are a total jQuery novice, you might want to check out our jQuery Quick Tutorial first. This article continues our jQuery Optimization series with five fresh jQuery tips to help you have a few more tricks up your sleeve. If you need more than just tips, check out our jQuery training courses! 1. Resize Fonts on the Fly There are many benefits to letting your… View full post »

jQuery Mobile – Beginner Tutorial

February 8th, 2012 Leave a comment 1 comment
jQuery Mobile - Beginner Tutorial

Being able to reach your audience via a mobile page is becoming almost as important as having a page at all but getting started in mobile site development can be frustrating. The jQuery library provides many handy mobile features that you can use to get started making great mobile-friendly web sites. In this article I will discuss the jQuery mobile framework features and give you a little demo on how it works. What is jQuery Mobile? jQuery Mobile is a unified framework that is designed to work on all major mobile platforms. This allows us to save a lot… View full post »

Optimizing jQuery – 10 Ways to Write Better Code

December 29th, 2011 Leave a comment
Optimizing jQuery - 10 Ways to Write Better Code

Most of us that began writing jQuery started because we heard how awesome it was and we were frustrated at JavaScript. jQuery is awesome, but like any programming language, there can be problems and pitfalls we want to try to avoid. This article talks about ten common better uses of jQuery that will help you get your job done right. They won’t make you a jQuery expert, but they will show you some best practices and better ways of using the library. 1. Make Sure Your Version is Up-to-date Why: jQuery is constantly changing and updating. Improvements to the… View full post »

jQuery Quick Tutorial

November 14th, 2011 Leave a comment 1 comment
jQuery Quick Tutorial

Whether you are new to JavaScript or have been developing for the Web for a while, learning jQuery can seem like a daunting task. If you have been wanting to give it a try, here is a quick primer to give you the facts and help you get started along with some examples for you to try out. If you want to play with the examples from this tutorial, feel free to download them from here. What is it? jQuery was originally developed by John Resig of the Mozilla Software Foundation in 2006 with the motto of “Write less, do more”…. View full post »

jQuery Lightbox Plugins: Top 5

March 21st, 2011 Leave a comment
jQuery Lightbox Plugins: Top 5

Everybody loves the good ol’ Lightbox image plugin. It has great utilities that spruce up a boring photo gallery with some awesome effects, and they’re generally very easy to install and customize. The only catch is Lightbox is based on the Prototype Framework and Scriptaculous Effects, a duo that hasn’t been as popular as the jQuery library. Most sites today do use jQuery, and adding two additional Javascript frameworks to the mix is both risky (there is a potential for construct conflict) and expensive (requires additional bandwidth on the page), especially if their sole purpose is to serve the… View full post »

Best jQuery Plugins for Your Website – Our Top 10 Choices

December 7th, 2010 Leave a comment 1 comment
Best jQuery Plugins for Your Website - Our Top 10 Choices

Web design, like any type of design, moves through times when certain styles and paradigms are popular. Creating some of the currently popular visual effects can be a difficult task. Added to this challenge are a number of common problems that web developers encounter. Here are 10 jQuery plugins that will help you create stunning visual effects on your web sites and solve many common web application challenges. Google Feed API Plugin http://plugins.jquery.com/project/jgfeed One common web development task is to include content from another web site or blog on a page. Often this is done in a sidebar or… View full post »

jQuery in Action Book Review

October 26th, 2010 Leave a comment
jQuery in Action Book Review

I’ve always been very good at keeping my skills sharp and learning new technologies as they emerge. My favorite way to do so has often been to read books on various IT topics and to experiment. It’s only natural that associates and friends often ask me to recommend books to them. I’ve been using jQuery for about 3 years now for most of my JavaScript development and wanted to get a more in-depth understanding of it. To do so, I turned to jQuery in Action, Second Edition by Bear Bibeault and Yehuda Katz. I really cannot recommend… View full post »