the idea I have in mind is:
* You have your normal HTML structure with your own CSS applied:
header, body, header, body, etc... within a container. All very
accessible and W3C standard.
* If you have Javascript enabled, and apply a (future "kikeTabs")
jquery plugin: it will add all sugar (new CSS, events, actions,
behaivours, etc...) to display content as TABs layout and to
behave like them.
* So, the whole thing is completely accessible and W3C standard
friendly.
, the "problem" is that actual official TABS plugin is GREAT and very
complete. I see it more like re-adapting it to fit this new DOM
structure, and to add 8 CSS combinations, keeping all the other
parameters. I don't want to reinvent the wheel. But I wonder if it is
easier to the TABS plugin creators to make this adaptation, if they find
this useful....;-)
Anyway, in a near future I would do it.
thanxs,
El 16/01/2008 11:55, Dan Eastwell escribió:
Hi Enrique,
It's looking good. Have you tried applying the jquery tabs plugin or
any similar tabbing script to make them function? Bearing in mind that
the idea behind tabs is to use javascript to apply the css structure,
so that people without script can see the content.
All the best,
Dan.
On Jan 16, 2008 9:45 AM, Enrique Meléndez Estrada <[EMAIL PROTECTED]
<mailto:[EMAIL PROTECTED]>> wrote:
Yes, it is working.
This is TABS layout, not TABS behaviour. It miss the proper
jquery-javascript events and actions. this is a demo which shows
that it
is possible to display the HTML elements on screen as TABS layout
without changing the DOM structure.
El 15/01/2008 19:14, Olivier Percebois-Garve escribió:
> Hi
>
> I Just had a quick look in Opera 9.25 and it is not working...
>
> Olivier
>
> Enrique Meléndez Estrada wrote:
>>
>> Looking at "official" TABs plugin, I realized that the HTML
structure
>> is not very "natural". It uses a list (UL) of tab headers
follow by
>> tab bodies (DIV). Normally, what you get from your favorite CMS is
>> something more like : a header (div, h,...), its body (div),
another
>> header (div, h, ...), its body (div), etc...
>>
>>
>> My challenge was, using this last "natural" HTML structure, try to
>> layout it in a TABs way. I think I've got it:
>>
>> http://www.ita.es/jquery/tabs_only_css.htm
>>
>> , where practically I have used the same HTML for all 8 TABS
>> combinations. The result is compatible with IE6, IE7, FF and Opera.
>> But there are some limitations to take into account when
implementing
>> as a Jquery plugin (as I wish, ;-):
>>
>> *
>> Only versions topRight, topLeft, leftTop and rightTop are100%
>> automatic (CSS doesn't depend on TABs number, height and
width).
>> *
>> Versions leftBottom, rightBottom, bottomLeft and bottomRight
>> depends on TABS number, and the height and/or width applied
>> (This is very "jquerysh-able")
>> *
>> I used QUIRK format (see doctype in HTML) for IE: the
same CSS
>> for IE6 and IE7, but in STRICT format it would only work
in IE7
>> (I don't control IE6 by now)
>> * Body TABs height is fixed (100px) and scroll appears where
>> content doesn't fit. In case of non-liquid TABs, with fixed
>> width, it could be possible to automatically calculate
height
>> for no-scroll body via jquery-script with 3 modes:
>> *
>> 1.
>> height fixed: like now in the example.
>> 2.
>> height max: fixed to maximum no-scroll body TAB height.
>> 3.
>> height auto: calculating each no-scroll body TAB
height.
>>
>> With all this, next steps would be: to search a little more for
IE6
>> STRICT mode compatibility, and to create a Jquery plugin (with CSS
>> dinamically generated?)
>>
>> Any suggestions, help, critics, comments, are very welcome.
>> --
>> Enrique Meléndez Estrada (2367)
>> Servicios Informáticos
>> Organización y Servicios Internos
>> Instituto Tecnológico de Aragón
>
--
Enrique Meléndez Estrada (2367)
Servicios Informáticos
Organización y Servicios Internos
Instituto Tecnológico de Aragón
--
Daniel Eastwell
Portfolio and articles:
http://www.thoughtballoon.co.uk <http://www.thoughtballoon.co.uk>
Blog:
http://www.thoughtballoon.co.uk/blog
--
Enrique Meléndez Estrada (2367)
Servicios Informáticos
Organización y Servicios Internos
Instituto Tecnológico de Aragón
