jQuery for Designers - screencasts and tutorials
Van Remy Sharp
Ga met je muis over de titel van een podcast en druk op Afspelen om ernaar te luisteren. Open iTunes om podcasts te downloaden en je erop te abonneren.
Omschrijving podcast
Learn how easy it is to apply web interaction using jQuery.
| Naam | Omschrijving | Releasedatum | Prijs | ||
|---|---|---|---|---|---|
| 1 | VideoPopulate Select Boxes | It’s the age old (well, in webby terms) issue of how to populate one select box based on another’s selection. It’s actually quite easy compared with the bad old days, and incredibly easy with jQuery and a dash of Ajax. | 11-2-11 | Gratis | Bekijk in iTunes |
| 2 | VideoScroll Linked Navigation | There are a few websites I’ve seen lately that have a left hand navigation automatically updates it’s selection based on where you’ve scrolled to on the page. This tutorial will show you exactly how to achieve just that. | 18-8-10 | Gratis | Bekijk in iTunes |
| 3 | VideoDebugging Tools | Most of us have to make our web pages work in The Big Five browsers, so I thought it was about time I introduce you to the debugging tools for each of those browsers with a couple of tips thrown in to the mix. | 7-7-10 | Gratis | Bekijk in iTunes |
| 4 | VideoEnabling the Back Button | As we build more and more Ajaxy applications, and our apps reside on a single page, the browser’s native back button can get more and more broken. This episode will show you how to re-enable the back button on your apps. | 19-4-10 | Gratis | Bekijk in iTunes |
| 5 | VideoAdding Keyboard Navigation | I was recently asked how keyboard navigation could be supported to move a slider backwards and forwards. I've created a few tutorials on how to create sliders and carousels but not mentioned keyboard supported navigation yet. | 12-1-10 | Gratis | Bekijk in iTunes |
| 6 | VideoFixed Floating Elements | On visiting Apple’s web site an putting items in my shopping basket, I noticed (an old effect) where the shopping basket would follow me down the page. We’ll look at how to replicate the fixed floating sidebars or elements with very little jQuery. | 23-10-09 | Gratis | Bekijk in iTunes |
| 7 | VideoiPhone-like Sliding Headers | The iPhone has a few unique UI features, one in particular are the static headings when you’re scrolling through a list, so you know the context of the content. We’ll see how to create this effect using jQuery. | 10-9-09 | Gratis | Bekijk in iTunes |
| 8 | VideoAutomatic Infinite Carousel | Following on from the infinite carousel, there have been a number of requests asking how to make the scrolling action automatic, so I’ve gone ahead to explain how to achieve this. | 13-8-09 | Gratis | Bekijk in iTunes |
| 9 | VideoPlay School: Broken Repeating Animations | jQuery makes it incredibly easy to add effects to your web sites, but there’s some effects you just don’t want: the hover repeatedly to make the effect go wild! | 23-7-09 | Gratis | Bekijk in iTunes |
| 10 | VideoAPI: queue and dequeue | queue and dequeue are a pair of core data utilities that help you to add your own bespoke to animations. | 10-7-09 | Gratis | Bekijk in iTunes |
| 11 | VideojQuery Infinite Carousel | With jQuery for Designer’s redesign I decided to add a scrolling carousel that worked in the same way the carousel worked on the Apple Mac ads page. This tutorial will walk through the fundamentals of the effect and how to recreate it. | 11-6-09 | Gratis | Bekijk in iTunes |
| 12 | VideoSlideDown Animation Jump Revisited | When using slideDown depending on the layout of your page, you could still see the jumping effect, regardless of whether you fix the padding around the element. | 15-4-09 | Gratis | Bekijk in iTunes |
| 13 | VideoBBC Radio 1 Zoom Tabs | Gareth Rogers asked how to achieve the effect on the latest BBC Radio 1 website, where the mouse rolls over the image block, tabs slide up and the image zooms a little to reveal more of the picture. | 3-4-09 | Gratis | Bekijk in iTunes |
| 14 | VideoAPI: map & grep | map and grep are two utilities that are extremely useful if you know how to use them, but more often that not, I see more convoluted code written to achieve the effect of these functions. Historically, I believe that John Resig was inspired by the Perl functions of the same name - which are basic building blocks of the Perl programming language. Let’s look at how you can use these functions. | 25-3-09 | Gratis | Bekijk in iTunes |
| 15 | VideojQuery look: Tim Van Damme | Jonathan Diba writes to ask how the effects are achieve on Tim Van Damme's portfolio site, referring to Tim's site as one of the most compelling site design he's seen. The two key effects Tim is using are a simplified accordion and a hover effect. It's worth noting that the hover effect only works in WebKit (Safari & Chrome), but I'll show you how to create the effect using jQuery too. | 20-2-09 | Gratis | Bekijk in iTunes |
| 16 | VideoHow to test if an Element Exists | A common question for beginners coming to jQuery: "Is there a function to return true or false if an element exists?" Not really, but there is a (very simple) way to find out. | 10-2-09 | Gratis | Bekijk in iTunes |
| 17 | VideoAjax Spy | Last month I showed you how to create a spy effect as seen on the first version of QuickSnapper (though they've since changed their site design with to release the release of Little Snapper). However I did promise I would demonstrate how to ajaxify the spy. | 30-1-09 | Gratis | Bekijk in iTunes |
| 18 | VideoPlay School: Easy Ajax - load | Ajax is made incredibly simple with jQuery. There's a number of helper functions to get in to the nitty gritty of Ajax, but if you want something that's quick and simple to get going with the .load function is the best place to start. | 13-1-09 | Gratis | Bekijk in iTunes |
| 19 | VideoAPI: Filter and Find | As the first in the series of API screencasts, but also as a good beginners tutorial, this short episode shows the difference between filter and find. | 6-1-09 | Gratis | Bekijk in iTunes |
| 20 | VideoSimple jQuery Spy Effect | A few years ago Digg released a very cool little visualisation tool they dubbed the Digg Spy (it's since been upgraded to the Big Spy). Recently Realmac Software released the site QuickSnapper to accompany LittleSnapper. It's the QuickSnapper site (the left hand side) that makes use of the similar spy technique that I'll explain how to produce. | 2-12-08 | Gratis | Bekijk in iTunes |
| 21 | VideoFun with Overflows - Part 1 | Making use of the overflow and scrollLeft DOM property to scroll elements is a much more effective use of the CPU, over animating using CSS top/left. So this episode of J4D demonstrates the same effect used in two completely different ways. The first is a scrollable timeline. A couple of readers requested a demo of how Plurk's browse timeline works. In addition, in the last month, Google released a 10 year timeline - so I wanted to show how this works. | 16-10-08 | Gratis | Bekijk in iTunes |
| 22 | VideoFun with Overflows - Part 2 | Making use of the overflow and scrollLeft DOM property to scroll elements is a much more effective use of the CPU, over animating using CSS top/left. So this episode of J4D demonstrates the same effect used in two completely different ways. The second was a request from Trevor Morris who's involved with/runs Geek in the Park. He asked whether the techniques I used in a jQuery marquee plugin I wrote recently could be used to smooth out CPU spikes that were occurring on his site when the header pattern flowed. | 16-10-08 | Gratis | Bekijk in iTunes |
| 23 | VideoAnimation Jump - quick tip | jQuery has got good base level support for effects out of the box. Setting them up and using them to reveal and hide elements is exceptionally easy. However, on more than one occasion I've found that after creating a sliding effect, the animation jumps on completion. Having found the cause, I thought it only fair to share and explain why it's happening and how to avoid it. | 19-8-08 | Gratis | Bekijk in iTunes |
| 24 | VideoImage Fade Revisited | This episode is revisiting the image cross fade effect, in particular Dragon Interactive has a beautiful little transition for their navigation that some readers have been requesting. Greg Johnson takes it one step further to implement this method using jQuery and the methods shown here. | 28-7-08 | Gratis | Bekijk in iTunes |
| 25 | VideoCoda Slider Effect | Although Panic didn't really invent the effect, the sliding panels on the Coda is great implementation of this effect. This article will pick apart the pieces required to create the effect, and how to better it. | 3-6-08 | Gratis | Bekijk in iTunes |
| 26 | VideoImage Cross Fade Transition | A frequent query and request I receive (and have myself) as a developer is: "how can I fade one image in to another?". In particular, image rollovers are so 90s - we want rollover transitions! | 11-4-08 | Gratis | Bekijk in iTunes |
| 27 | VideoCoda Popup Bubbles | Coda is one of the new web development tools for the Mac - and it's popular amongst designers and developers I know. Panic (the developers of Coda) are also known for their sharp design. In particular, Jorge Mesa writes to ask how to re-create their 'puff' popup bubble shown when you mouse over the download image. In essence the effect is just a simple combination of effect, but there's a few nuances to be wary of. | 3-4-08 | Gratis | Bekijk in iTunes |
| 28 | VideoSlider Gallery | The Apple web site 'product slider' is similar to a straight forward gallery, except that there is a slider to navigate the items, i.e. the bit the user controls to view the items. Simple stuff. jQuery already has the plugins to create these effects so we don't have to go about creating them ourselves from scratch. | 18-2-08 | Gratis | Bekijk in iTunes |
| 29 | VideoImage Loading | This tutorial will show how to load images in the background, and once loaded handle the event and create your own response. This is similar to the lightbox effect, except we have full control of the load event. | 4-2-08 | Gratis | Bekijk in iTunes |
| 30 | VideojQuery Tabs - part 2 | Tabbing has been common place on the Internet for some time now. Today web sites will make use of tabbing without the page having to reload with the addition of JavaScript. For this tutorial I have created two screencasts demonstrating how to quickly apply a dash of jQuery to different layouts of markup, which, if the markup is well designed, it will automatically degrade nicely without JavaScript enabled. In a future article we will cover default browser functionality (i.e. supporting back, forward and bookmark buttons) and saving tab states. | 18-1-08 | Gratis | Bekijk in iTunes |
| 31 | VideojQuery Tabs - part 1 | Tabbing has been common place on the Internet for some time now. Today web sites will make use of tabbing without the page having to reload with the addition of JavaScript. For this tutorial I have created two screencasts demonstrating how to quickly apply a dash of jQuery to different layouts of markup, which, if the markup is well designed, it will automatically degrade nicely without JavaScript enabled. In a future article we will cover default browser functionality (i.e. supporting back, forward and bookmark buttons) and saving tab states. | 18-1-08 | Gratis | Bekijk in iTunes |
| Totaal: 31 afleveringen |
Kijkers hebben zich ook geabonneerd op

- The Official jQuery Podcast
- Ralph Whitbeck & Rey Bango
- Bekijk in iTunes

- CSS-Tricks Screencasts
- Chris Coyier
- Bekijk in iTunes

- Nettuts+
- Nettuts+
- Bekijk in iTunes

- Doctype
- Done21 LLC
- Bekijk in iTunes

- Gratis
- Categorie: Zo doet u dat-software
- Taal: Engels
- © All screencasts copyright of Remy Sharp

