You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@jspwiki.apache.org by Bob Paige <bo...@gmail.com> on 2008/07/11 20:42:34 UTC
S5 css question
Not specifically a JSPWiki question, but related nonetheless:
When I create presentations with S5, the fonts are a fixed size (different
headers, etc.) as I resize the browser window.
I wonder if (through CSS) that could define the font sizes to be relative?
Is this a straightforward CSS change?
--
Bobman
Re: S5 css question
Posted by Eric Ladner <er...@gmail.com>.
On Fri, Jul 11, 2008 at 1:42 PM, Bob Paige <bo...@gmail.com> wrote:
> Not specifically a JSPWiki question, but related nonetheless:
>
> When I create presentations with S5, the fonts are a fixed size (different
> headers, etc.) as I resize the browser window.
>
> I wonder if (through CSS) that could define the font sizes to be relative?
> Is this a straightforward CSS change?
yes.. instead of defining the font sizes in "px" (pixels), use "em" (em's).
See http://www.alistapart.com/articles/elastic for a good article on
the subject.
--
Eric Ladner
Re: S5 css question
Posted by Dirk Frederickx <di...@gmail.com>.
Bob,
The rescaling is indeed driven by javascript and not only by css.
In the original code of E.Meyer you 'll find a fontScale() routine
which is called whenever the window gets resized.
At the time I wrote the S5-plugin, I didn't include that routine, so
it is not part of the jspwiki S5.
You'll find the rouine inside the slides.js files of the original S5.
It shouldn't be too hard to port it.
dirk
On Fri, Jul 11, 2008 at 11:35 PM, Bob Paige <bo...@gmail.com> wrote:
> The sample you reference does scale dynamically, though a little roughly in
> FF3 (text overlaps sometimes) but we are getting close!
>
> Maybe there is some additional javascript in his CSS files that causes the
> sizes to be re-evaluated when the window size changes? I'm reaching.
>
> --
> Bobman
>
>
> On Fri, Jul 11, 2008 at 4:44 PM, Dirk Frederickx <di...@gmail.com>
> wrote:
>
>> Bob,
>>
>> I see you what you mean.
>> It is indeed strange, but I can't see quickly why it isn't scaling
>> properly.
>>
>> Plse verify the original S5 implementation of Eric Meyer at
>> http://meyerweb.com/eric/tools/s5/s5-intro.html
>> where you will see that the font's properly scale when the window is
>> resized.
>>
>>
>>
>> dirk
>>
>> On Fri, Jul 11, 2008 at 10:25 PM, Bob Paige <bo...@gmail.com> wrote:
>> > I think I'm not making myself clear.
>> >
>> > Suppose I create a presentation with Powerpoint. Each page has a title
>> and
>> > some content. While editing in the 'slides' view, I can resize the slide
>> all
>> > I want the content does now reflow; instead everything grows or shrinks
>> > (zooms in or out) based on the size of the slide. This is the behavior I
>> am
>> > asking for.
>> >
>> > Instead with S5 (which uses ems, BTW), as I resize the browser window
>> > everything reflows and the text stubbornly stays the same size it was.
>> Thus,
>> > if I make the window smaller, I see less content. With the powerpoint
>> > approach, if I make the window smaller, I see the same content, just
>> > smaller.
>> >
>> > I think what I'd need to do is define the font sizes as a percentage of
>> the
>> > window size, not in points or ems. Make sense?
>> >
>> > Is this possible with CSS?
>> >
>> > --
>> > Bobman
>> >
>> >
>> > On Fri, Jul 11, 2008 at 3:52 PM, Dirk Frederickx <
>> dirk.frederickx@gmail.com>
>> > wrote:
>> >
>> >> Strange.
>> >> Cause afaik all s5 css rules use fluid font metrics (em based)
>> >> Which browser are you using ? Could you post a screen-shot ?
>> >>
>> >>
>> >> dirk
>> >>
>> >>
>> >> On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
>> >> > Not specifically a JSPWiki question, but related nonetheless:
>> >> >
>> >> > When I create presentations with S5, the fonts are a fixed size
>> >> (different
>> >> > headers, etc.) as I resize the browser window.
>> >> >
>> >> > I wonder if (through CSS) that could define the font sizes to be
>> >> relative?
>> >> > Is this a straightforward CSS change?
>> >> >
>> >> > --
>> >> > Bobman
>> >> >
>> >>
>> >
>>
>
Re: S5 css question
Posted by Dirk Frederickx <di...@gmail.com>.
Bob,
The rescaling is indeed driven by javascript and not only by css.
In the origigna
On Fri, Jul 11, 2008 at 11:35 PM, Bob Paige <bo...@gmail.com> wrote:
> The sample you reference does scale dynamically, though a little roughly in
> FF3 (text overlaps sometimes) but we are getting close!
>
> Maybe there is some additional javascript in his CSS files that causes the
> sizes to be re-evaluated when the window size changes? I'm reaching.
>
> --
> Bobman
>
>
> On Fri, Jul 11, 2008 at 4:44 PM, Dirk Frederickx <di...@gmail.com>
> wrote:
>
>> Bob,
>>
>> I see you what you mean.
>> It is indeed strange, but I can't see quickly why it isn't scaling
>> properly.
>>
>> Plse verify the original S5 implementation of Eric Meyer at
>> http://meyerweb.com/eric/tools/s5/s5-intro.html
>> where you will see that the font's properly scale when the window is
>> resized.
>>
>>
>>
>> dirk
>>
>> On Fri, Jul 11, 2008 at 10:25 PM, Bob Paige <bo...@gmail.com> wrote:
>> > I think I'm not making myself clear.
>> >
>> > Suppose I create a presentation with Powerpoint. Each page has a title
>> and
>> > some content. While editing in the 'slides' view, I can resize the slide
>> all
>> > I want the content does now reflow; instead everything grows or shrinks
>> > (zooms in or out) based on the size of the slide. This is the behavior I
>> am
>> > asking for.
>> >
>> > Instead with S5 (which uses ems, BTW), as I resize the browser window
>> > everything reflows and the text stubbornly stays the same size it was.
>> Thus,
>> > if I make the window smaller, I see less content. With the powerpoint
>> > approach, if I make the window smaller, I see the same content, just
>> > smaller.
>> >
>> > I think what I'd need to do is define the font sizes as a percentage of
>> the
>> > window size, not in points or ems. Make sense?
>> >
>> > Is this possible with CSS?
>> >
>> > --
>> > Bobman
>> >
>> >
>> > On Fri, Jul 11, 2008 at 3:52 PM, Dirk Frederickx <
>> dirk.frederickx@gmail.com>
>> > wrote:
>> >
>> >> Strange.
>> >> Cause afaik all s5 css rules use fluid font metrics (em based)
>> >> Which browser are you using ? Could you post a screen-shot ?
>> >>
>> >>
>> >> dirk
>> >>
>> >>
>> >> On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
>> >> > Not specifically a JSPWiki question, but related nonetheless:
>> >> >
>> >> > When I create presentations with S5, the fonts are a fixed size
>> >> (different
>> >> > headers, etc.) as I resize the browser window.
>> >> >
>> >> > I wonder if (through CSS) that could define the font sizes to be
>> >> relative?
>> >> > Is this a straightforward CSS change?
>> >> >
>> >> > --
>> >> > Bobman
>> >> >
>> >>
>> >
>>
>
Re: S5 css question
Posted by Bob Paige <bo...@gmail.com>.
The sample you reference does scale dynamically, though a little roughly in
FF3 (text overlaps sometimes) but we are getting close!
Maybe there is some additional javascript in his CSS files that causes the
sizes to be re-evaluated when the window size changes? I'm reaching.
--
Bobman
On Fri, Jul 11, 2008 at 4:44 PM, Dirk Frederickx <di...@gmail.com>
wrote:
> Bob,
>
> I see you what you mean.
> It is indeed strange, but I can't see quickly why it isn't scaling
> properly.
>
> Plse verify the original S5 implementation of Eric Meyer at
> http://meyerweb.com/eric/tools/s5/s5-intro.html
> where you will see that the font's properly scale when the window is
> resized.
>
>
>
> dirk
>
> On Fri, Jul 11, 2008 at 10:25 PM, Bob Paige <bo...@gmail.com> wrote:
> > I think I'm not making myself clear.
> >
> > Suppose I create a presentation with Powerpoint. Each page has a title
> and
> > some content. While editing in the 'slides' view, I can resize the slide
> all
> > I want the content does now reflow; instead everything grows or shrinks
> > (zooms in or out) based on the size of the slide. This is the behavior I
> am
> > asking for.
> >
> > Instead with S5 (which uses ems, BTW), as I resize the browser window
> > everything reflows and the text stubbornly stays the same size it was.
> Thus,
> > if I make the window smaller, I see less content. With the powerpoint
> > approach, if I make the window smaller, I see the same content, just
> > smaller.
> >
> > I think what I'd need to do is define the font sizes as a percentage of
> the
> > window size, not in points or ems. Make sense?
> >
> > Is this possible with CSS?
> >
> > --
> > Bobman
> >
> >
> > On Fri, Jul 11, 2008 at 3:52 PM, Dirk Frederickx <
> dirk.frederickx@gmail.com>
> > wrote:
> >
> >> Strange.
> >> Cause afaik all s5 css rules use fluid font metrics (em based)
> >> Which browser are you using ? Could you post a screen-shot ?
> >>
> >>
> >> dirk
> >>
> >>
> >> On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
> >> > Not specifically a JSPWiki question, but related nonetheless:
> >> >
> >> > When I create presentations with S5, the fonts are a fixed size
> >> (different
> >> > headers, etc.) as I resize the browser window.
> >> >
> >> > I wonder if (through CSS) that could define the font sizes to be
> >> relative?
> >> > Is this a straightforward CSS change?
> >> >
> >> > --
> >> > Bobman
> >> >
> >>
> >
>
Re: S5 css question
Posted by Dirk Frederickx <di...@gmail.com>.
Bob,
I see you what you mean.
It is indeed strange, but I can't see quickly why it isn't scaling properly.
Plse verify the original S5 implementation of Eric Meyer at
http://meyerweb.com/eric/tools/s5/s5-intro.html
where you will see that the font's properly scale when the window is resized.
dirk
On Fri, Jul 11, 2008 at 10:25 PM, Bob Paige <bo...@gmail.com> wrote:
> I think I'm not making myself clear.
>
> Suppose I create a presentation with Powerpoint. Each page has a title and
> some content. While editing in the 'slides' view, I can resize the slide all
> I want the content does now reflow; instead everything grows or shrinks
> (zooms in or out) based on the size of the slide. This is the behavior I am
> asking for.
>
> Instead with S5 (which uses ems, BTW), as I resize the browser window
> everything reflows and the text stubbornly stays the same size it was. Thus,
> if I make the window smaller, I see less content. With the powerpoint
> approach, if I make the window smaller, I see the same content, just
> smaller.
>
> I think what I'd need to do is define the font sizes as a percentage of the
> window size, not in points or ems. Make sense?
>
> Is this possible with CSS?
>
> --
> Bobman
>
>
> On Fri, Jul 11, 2008 at 3:52 PM, Dirk Frederickx <di...@gmail.com>
> wrote:
>
>> Strange.
>> Cause afaik all s5 css rules use fluid font metrics (em based)
>> Which browser are you using ? Could you post a screen-shot ?
>>
>>
>> dirk
>>
>>
>> On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
>> > Not specifically a JSPWiki question, but related nonetheless:
>> >
>> > When I create presentations with S5, the fonts are a fixed size
>> (different
>> > headers, etc.) as I resize the browser window.
>> >
>> > I wonder if (through CSS) that could define the font sizes to be
>> relative?
>> > Is this a straightforward CSS change?
>> >
>> > --
>> > Bobman
>> >
>>
>
Re: S5 css question
Posted by Bob Paige <bo...@gmail.com>.
I think I'm not making myself clear.
Suppose I create a presentation with Powerpoint. Each page has a title and
some content. While editing in the 'slides' view, I can resize the slide all
I want the content does now reflow; instead everything grows or shrinks
(zooms in or out) based on the size of the slide. This is the behavior I am
asking for.
Instead with S5 (which uses ems, BTW), as I resize the browser window
everything reflows and the text stubbornly stays the same size it was. Thus,
if I make the window smaller, I see less content. With the powerpoint
approach, if I make the window smaller, I see the same content, just
smaller.
I think what I'd need to do is define the font sizes as a percentage of the
window size, not in points or ems. Make sense?
Is this possible with CSS?
--
Bobman
On Fri, Jul 11, 2008 at 3:52 PM, Dirk Frederickx <di...@gmail.com>
wrote:
> Strange.
> Cause afaik all s5 css rules use fluid font metrics (em based)
> Which browser are you using ? Could you post a screen-shot ?
>
>
> dirk
>
>
> On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
> > Not specifically a JSPWiki question, but related nonetheless:
> >
> > When I create presentations with S5, the fonts are a fixed size
> (different
> > headers, etc.) as I resize the browser window.
> >
> > I wonder if (through CSS) that could define the font sizes to be
> relative?
> > Is this a straightforward CSS change?
> >
> > --
> > Bobman
> >
>
Re: S5 css question
Posted by Dirk Frederickx <di...@gmail.com>.
Strange.
Cause afaik all s5 css rules use fluid font metrics (em based)
Which browser are you using ? Could you post a screen-shot ?
dirk
On Fri, Jul 11, 2008 at 8:42 PM, Bob Paige <bo...@gmail.com> wrote:
> Not specifically a JSPWiki question, but related nonetheless:
>
> When I create presentations with S5, the fonts are a fixed size (different
> headers, etc.) as I resize the browser window.
>
> I wonder if (through CSS) that could define the font sizes to be relative?
> Is this a straightforward CSS change?
>
> --
> Bobman
>