SupportCasts™ - Rapidweaver Screencasts
Video Tutorials and Learning for Rapidweaver Users
Getting a background image to scale to 100% of the viewer’s browser window width and height is tricky. Pure CSS or even CSS3 do a good job in many browser but fail in IE6, IE7 and even IE8. Opera and others fail depending on how you do it with CSS.
jQuery steps up to the plate and solves it. Well, almost. Just one little niggle. If you can live with it then this is the solution for you in all browser except IE6.
Show Notes
http://mediacloud.supportcasts.com/apple_tv/jquery/full-bg-jquery.wo.m4v
Using CSS3 to round corners on images varies in quality and it doesn’t work in all browsers. Add in a little help from jQuery and you get good looking corners and even shadows. In this video tutorial you will see now to do this easily.
Show Notes
Please Login or Register with SupportCasts to view the rest of this content.
TinyTips has been updated to version 1.1. What better way to investigate the changes than a new screencast.
Mike Merritt of Digital Inferno has added some colorful additions to this easy and flexible jQuery tooltip.
I will also address a question in this video tutorial that was asked from the original screencasts; “How can you add the image separately using Stacks”.
So grab the new download, set back, and join me as we revisit TinyTip.
Please Login or Register with SupportCasts to view the rest of this content.
In this video tutorial we will look at changing from using the Cycle jQuery Plugin to the Nivo Slider for a different effect. It’s easy and gives you a few more options. Make sure you have seen jQuery Animated Headers Part 1 and Part 2 for the foundation to what I am doing here.
Please Login or Register with SupportCasts to view the rest of this content.
Part 1 of our Mini Series on jQuery animated header images. No Flash required! ;-) (sorry Adobe…) In this video tutorial I go over a bit of history of what works and what issues arise from previous installations. We get the animation working and solve one of two issues. In Part 2 I will solve the “ugly page load” issue.
Please Login or Register with SupportCasts to view the rest of this content.
This is a beautiful navigation script from Codrops that sits nicely on the left, or top, of you RapidWeaver project.
In this video tutorial you will learn how to get all the elements in place. I’ll also show you that you can use both styles on one Rapidweaver page.
Grab the downloads and lets get started…
Don’t forget to grab the icon sets from DryIcons.
Those links are on the Codrop tutorial page below.
Codrops Website
Please Login or Register with SupportCasts to view the rest of this content.
TinyTips is a very lightweight jQuery tooltip plugin from Digital Inferno.
Join me as I show you how to add and deploy this tooltip into your design.
Please Login or Register with SupportCasts to view the rest of this content.
This is the 3rd, and final, screencast on “hiding” content using jQuery.
Scott Robbin has created pageSlide a unique way to keep content hidden of the main page and accessible with page links.
Join me as we explore this easy to use option for your next RapidWeaver layout.
You can download the files from the link on Scott’s page located here – http://srobbin.com/blog/jquery-pageslide/
Please Login or Register with SupportCasts to view the rest of this content.
Welcome to the 2nd of 3 casts that gives us another way to “slide” content into our layouts.
Slidebox is an easy to use option that works from the top, or the bottom, of your layout.
You can download the script package here – http://www.samuelgarneau.com/lab/slidebox/
So join me once again as we explore what jQuery and Slidebox can do for your next project.
Please Login or Register with SupportCasts to view the rest of this content.
Here’s a nice little jQuery tooltip plugin called TipTip created by Drew Wilson.
Loaded with CSS3 styling that degrades nicely in non-supported browsers and requires no images.
tipTip will add some simple flair to your projects tooltips with ease. Did I mention that its a “smart” tip as well…
So download the script files over at http://code.drewwilson.com/entry/tiptip-jquery-plugin
and join me for another great tooltip option.
Please Login or Register with SupportCasts to view the rest of this content.
This is the first of three casts that will cover some excellent ways for you to add “slide out” content.
tabSlideOut is an excellent jQuery plugin that provides a variety of features that include using your own images and 4 available positioning options.
You can download the script package here… http://www.building58.com/examples/tabSlideOut.html
Join me as we explore what jQuery and tabSlideOut can do for your next project.
Please Login or Register with SupportCasts to view the rest of this content.
Happy weaving
