Posts Tagged ‘jQuery’

We are pleased to present below all posts tagged with ‘jQuery’.

Progressive And Responsive Navigation

Developing for the Web can be a difficult yet rewarding job. Given the number of browsers across the number of platforms, it can sometimes be a bit overwhelming. But if we start coding with a little forethought and apply the principles of progressive enhancement from the beginning and apply some responsive practices at the end, we can easily accommodate for less-capable browsers and reward those with modern browsers in both desktop and mobile environments.

Progressive And Responsive Navigation

Resetting our CSS styles is where we’ll start. Browsers have different default styles for the elements we’ll be using, so understanding this and getting all of the elements to look the same is important. In this example, since we’re using an unordered list, there will be default left padding, top and bottom margins, and a list-style.

Read more...

A Beginner’s Guide To jQuery-Based JSON API Clients

Are you fascinated by dynamic data? Do you go green with envy when you see tweets pulled magically into websites? Trust me, I’ve been there.

A Beginner’s Guide To jQuery-Based JSON API Clients

The goal of today’s tutorial is to create a simple Web app for grabbing movie posters from TMDb. We’ll use jQuery and the user’s input to query a JSON-based API and deal with the returned data appropriately.

Read more...

Essential jQuery Plugin Patterns

I occasionally write about implementing design patterns in JavaScript. They’re an excellent way of building upon proven approaches to solving common development problems, and I think there’s a lot of benefit to using them. But while well-known JavaScript patterns are useful, another side of development could benefit from its own set of design patterns: jQuery plugins. The official jQuery plugin authoring guide offers a great starting point for getting into writing plugins and widgets, but let’s take it further.

Essential jQuery Plugin Patterns

Plugin development has evolved over the past few years. We no longer have just one way to write plugins, but many. In reality, certain patterns might work better for a particular problem or component than others. Some developers may wish to use the jQuery UI widget factory; it’s great for complex, flexible UI components. Some may not. Some might like to structure their plugins more like modules (similar to the module pattern) or use a more formal module format such as AMD. And so on.

Read more...

Create An Animated Bar Graph With HTML, CSS And jQuery

People in boardrooms across the world love a good graph. They go nuts for PowerPoint, bullet points and phrases like “run it up the flagpole,” “blue-sky thinking” and “low-hanging fruit,” and everything is always “moving forward.” Backwards is not an option for people who facilitate paradigm shifts in the zeitgeist. Graphs of financial projections, quarterly sales figures and market saturation are a middle-manager’s dream.

How can we as Web designers get in on all of this hot graph action? There are actually quite a few ways to display graphs on the Web. We could simply create an image and nail it to a Web page. But that’s not very accessible or interesting. We could use Flash, which is quite good for displaying graphs — but again, not very accessible. Besides, designers, developers and deities are falling out of love with Flash.

Read more...

Five Useful Interactive CSS/jQuery Techniques Deconstructed

With the wide variety of CSS3 and JavaScript techniques available today, it's easier than ever to create unique interactive websites that delight visitors and provide a more engaging user experience. In this article, we'll walk through five interactive techniques that you can start using right now. We'll cover animated text effects, animated images without GIFs, mega drop-down menus, fancy slideshow navigation and animated icons for the hover state of buttons.

Five Useful Interactive CSS/jQuery Techniques Deconstruted

Besides learning how to accomplish these specific tasks, you'll also master a variety of useful CSS and jQuery tricks that you can leverage when creating your own interactive techniques. The solutions presented here are certainly not perfect, so any thoughts, ideas and suggestions on how you would solve these design problems would be very appreciated.

Read more...

Useful JavaScript and jQuery Tools, Libraries, Plugins

Recently we’ve been receiving more requests for carefully selected, useful round-ups. We try to avoid round-ups on Smashing Magazine, but sometimes the format is useful and — if the resources are relevant — can be extremely helpful. Besides, we are glad to drive traffic to some obscure, yet useful resources and thus support the developers of these resources.

jStat : a JavaScript statistical library

[fblike]

In this round-up, you'll find some of the useful JavaScript and jQuery tools, libraries and plugins that we have stumbled upon recently. Hopefully, you'll find them valuable for your upcoming projects. Among other things, you'll find handy services and online utilities, recently released JavaScript libraries and jQuery plugins.

Read more...

Image Manipulation With jQuery & PHP GD

One of the numerous advantages brought about by the explosion of jQuery and other JavaScript libraries is the ease with which you can create interactive tools for your site. When combined with server-side technologies such as PHP, this puts a serious amount of power at your finger tips.

Image Manipulation With jQuery and PHP GD

[fblike]

In this article, I’ll be looking at how to combine JavaScript/jQuery with PHP and, particularly, PHP’s GD library to create an image manipulation tool to upload an image, then crop it and finally save the revised version to the server. Sure, there are plugins out there that you can use to do this; but this article aims to show you what's behind the process. You can download the source files for reference.

Read more...

↑ Back to top