[UPHPU] So they want tabs, huh?
mbarrus73 at yahoo.com
Thu Feb 1 08:56:19 MST 2007
I use tabs all over the place. I used to create them myself, but the
foundation for creating tabs.
Display divs that control your tab content....
<!-- Dependencies -->
<!-- core CSS -->
<link rel="stylesheet" type="text/css" href="tabview.css">
<!-- optional skin for border tabs -->
<link rel="stylesheet" type="text/css" href="border_tabs.css">
<!-- OPTIONAL: Connection (required for dynamic loading of data) -->
<!-- Source file -->
var myTabs = new YAHOO.widget.TabView("demo");
<!-- This is tabview tab markup -->
<div id="demo" class="yui-navset">
<li class="selected"><a href="#tab1"><em>Tab One Label</em></a></li>
<li><a href="#tab2"><em>Tab Two Label</em></a></li>
<li><a href="#tab3"><em>Tab Three Label</em></a></li>
<div><p>Tab One Content</p></div>
<div><p>Tab Two Content</p></div>
<div><p>Tab Three Content</p></div>
The example is very basic but works. It might not be exactly what you are
looking for, but might give you a starting point. I have including links
where you can get more information about YUI and the YUI Tabview.
> -----Original Message-----
> From: uphpu-bounces at uphpu.org [mailto:uphpu-bounces at uphpu.org] On Behalf
> Of cole at colejoplin.com
> Sent: Wednesday, January 31, 2007 5:52 PM
> To: uphpu at uphpu.org
> Subject: [UPHPU] So they want tabs, huh?
> Hi Everyone,
> I've started down the road a bit here, I've got a solution, but wanted
> that has a price comparison for DVDs. Here's an example, the big
> yellow Compare Prices button at
> http://movies.toptenreviews.com/reviews/mr88.htm. Please don't get me
> started on page design here, let's just say I'd love to see some
> changes, all over the place. I have boundaries to observe, and there
> are lots of other hands involved.
> They want to compare prices widescreen to widescreen, fullscreen to
> fullscreen, director's cuts, extended editions...you get the idea from
> the popup. They want to lose the popup, and have tabs within the page
> to do the display. My first reaction was AJAX, and I've already got a
> solution that does that. I was inspired by an example at
> (http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/), but
> have made some additions to do simple content, with no external file
> loading involved. I'll use PHP to create the tab content.
> What I like about it is the vertical resizing. No one is sqeamish
> should consider. I have to have a working demo on Monday.
> Thanks. -- Cole
> P.S. In case someone is shocked to see actual tables in the popup
> page, note they are strictly for *tabular data* only. The movie page
> itself has no tables at all, and is a treasure trove of layout
> UPHPU mailing list
> UPHPU at uphpu.org
> IRC: #uphpu on irc.freenode.net
More information about the UPHPU