F2E Summit Examples
Hey All –
I have uploaded the examples that I talked about in my presentation at the Yahoo! F2E Summit on Wed.
If you want to dive in, you can see the examples here:
http://blog.davglass.com/files/yui/class/f2e/
Now I’ll try to explain them a little here:
1. Panel Tricks
This is a simple mouseover example with a panel.
http://blog.davglass.com/files/yui/class/f2e/example1/
Using the same technique, we use it to build more info bubbles for form inputs.
http://blog.davglass.com/files/yui/class/f2e/example1/solution2.php
2. AutoComplete Trickery
This example shows “another way to look” at the AutoComplete widget.
http://blog.davglass.com/files/yui/class/f2e/example2/
3. TabView Hacks
This example shows how to make an animated TabView in about 10 minutes.
http://blog.davglass.com/files/yui/class/f2e/example3/
This example takes the code from the previous and turns a normal TabView widget into a nifty “Accordion” widget.
http://blog.davglass.com/files/yui/class/f2e/example3/solution2.php
4. Animation Hacks
These are just too kewl, you really need to see them. So take a look, read the source and see if you can tell what’s going on ![]()
http://blog.davglass.com/files/yui/class/f2e/example4/
http://blog.davglass.com/files/yui/class/f2e/example4/solution.php
The purpose of my talk was to let everyone know that:
“You can’t judge a Widget by it’s name”
It’s a hard point to get across, I may write more about it later (if people want to know).
Hope you enjoy the examples.. ![]()








March 9th, 2007 at 11:27 am
Cool examples. But, #1 isn’t working in Safari.
March 9th, 2007 at 11:50 am
Rich –
What part of example #1 isn’t working in Safari?
I can pull it up fine
March 9th, 2007 at 4:35 pm
The panels either flash very briefly and disappear, or don’t appear at all.
March 9th, 2007 at 5:46 pm
What version of Safari?
I’m testing on 2.0.4 and it works perfect
March 10th, 2007 at 3:19 pm
This is with Safari 2.0.4 (419.3) on two different Macs. One an old G4 1 GHZ laptop, the other a 2 GHz dual-CPU desktop G5.
April 5th, 2007 at 11:36 am
I really like you accordian example http://blog.davglass.com/files/yui/class/f2e/example3/solution2.php and have been playing around with it a bit. Do you know how to make the default selected tab not appear at the bottom of the tabs but under it’s parent content.
April 5th, 2007 at 12:05 pm
Joe –
Here is an updated example:
http://blog.davglass.com/files/yui/tab4/
April 5th, 2007 at 3:36 pm
Thanks, you’re the man.
April 20th, 2007 at 7:56 am
There is some extra space between the tabs in the accordian example in IE6Win. I’m trying to do something sililar and cannot get the spacing to go away thus far. Do you have any suggestions or a another version of that example?
April 20th, 2007 at 8:30 am
@Joe –
I think this example works better:
http://blog.davglass.com/files/yui/tab4/
But I don’t have access to a windows machine to test it with
It’s more than likely a padding/margin issue with the LI’s.