Centering

http://tinyurl.com/ypnfc8

?

If this is so, since they are reasonably fine uncentered anyway,
a URL to suitable javascript "solution" would be appreciated - if
there be such.

--
dorayme

Not full tested but...

Change style:
* {margin: 0; padding: 0;}
#wrapper div {margin: 2px; padding: 0; float: left; width: 102px;
height: 77px}
#wrapper div img {width:100px; height:75px; border: 1px solid #000;
background: #fff;}

Add "wrapper" DIV to contain all thumb DIVs:

<div id="wrapper">
<div>
<a href="some.html"><img src="landscapeThumb.gif" alt="some"></a>
</div>
...
</div>

JavaScript:
function centerMe(){
var offsetWidth=document.documentElement.offsetWidth
//thumb + border + margin
var thumb=100 + 2 + 4;
//number of thumbails across that will fit
var count=parseInt(offsetWidth/thumb);
//width for wrapper
var width=count * thumb;
//calc left margin
var left=parseInt((offsetWidth-width)/2)
//grab "wrapper" DIV
var wrap=document.getElementById('wrapper');
//adjust style
wrap.style.width=width + "px";
wrap.style.marginLeft=left + "px";
}

// attach events
if( window.addEventListener ) {
window.addEventListener('load',centerMe,false); //legacy
window.addEventListener('resize',centerMe,false);
} else if( document.addEventListener ) {
document.addEventListener('load',centerMe,false); //proper
document.addEventListener('resize',centerMe,false);
} else if( window.attachEvent ) {
window.attachEvent("onload", centerMe); //IE only
window.attachEvent("onresize", centerMe);
}

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

> Add "wrapper" DIV to contain all thumb DIVs:
>

> JavaScript:
> function centerMe(){
> var offsetWidth=document.documentElement.offsetWidth

Thanks for this Jonathan, it works in Safari, also in iCab but
not in FF or Opera. I have not tested in WinIE (it has no effect
in MacIE... <g>) I will put it up at:

http://tinyurl.com/ypnfc8

--
dorayme

Right, because even where shrink-to-fit wrappers like display:
table-cell and display: inline-block are supported, the computed
shrink-to-fit width in that example works out to be the same as the
available width anyway.

In that example, the minimum width is about 102px (the width of the
longest float), the maximum width is the width of all the floats on one
"line" (something huge). The available width, the width of BODY, is
likely to be between those two values.

Basically shrink-to-fit only "shrinks" to anything when the maximum
width (width of everything on one line) is smaller than the available
width.

In an ideal world you'd do this by making each thumbnail an inline-block
instead of a float, and putting text-align: center on their container.
That would give just the effect you want, and might even work on IE
since Mr Korpela has said that inline-blocks with widths set on them
give it less of a problem than usual.

I'm assuming you need the thumbnails to be little block boxes in their
own right-- if you don't need captions or anything, just use inline img
elements and don't float them. Use text-align: center on the container
and it will all work much like inline-blocks even in FF.

The problem if you just use inline-block is that it will look positively
wrong in FF (I suspect each image on its own line). So you could use
float, then the JS could sniff out whether inline-block is supported and
then just go round changing everything to inline block, i.e.

node.style.float = "none";
node.style.display = "inline-block";

etc.

You can leave #wrapper as text-align: center from the start since it
won't affect the floats.

Then you'd default to the floats even if JS was turned off, which would
be OK since they don't look that bad. If JS was on, and the browser
supported it, then you'd get the centering.

Works in my FF, SeaMonkey & Opera! And "sorta" for WinIE, some tweaking
maybe needed for IE "alternate" methods of calculating margins ;-) (In
IE's defense there is probably a round-off error issue).

Works in my Mac FF and Opera now.

While I am here Jonathan, I will take a peek on my Win 2000 box...

Nah, no good I am afraid. Yes, it is trying, but the effect is so
marginal as to count for a fail on this particular size
thumbnail. (I will leave you to ponder defences for WinIE, I feel
more merciless towards it).

Anyway, pity... The point of bothering with this sort of thing is
to provide for the majority in this centering. I will try to
tweak by using sizes that I often do use, namely, 200x150 for
landscape, 150x200 for portrait... maybe IE will do better with
different figures.

Just one q, is IE 7 any better than 6 on this score? In other
words, does IE 7 center the mass of thumbnails as good as in FF
or as weakly as in IE6?

In some of the applications I have in mind for this centering, I
have landscapes and portaits, each block with their own wrapper.
I suppose I would have to sophisticate up the JS to address the
two blocks...

Perhaps the situation could be improved (at the cost of a little
screen wastage) by somehow making for the mass as a whole to use
up a much more "noticeable" amount of left and right margin.

--
dorayme

...

Indeed and is easily observed by moving the closing div to the
wrapper up in the html to enclose just a few (say 8 - for a big
screen, gets a nice big fat margin, left and right) thumnbnail
divs.

My galleries usually have captions and the URL above was an
abstraction. In fact, to take a snip from an actual site I used:

a {display: block; font-size: 85%;}

and had short captions that sat nicely under each pic.

But ... back to centering...

I will just have to put all this on the back burner, I have no
idea how to go now. As someone here once said, one can convince
oneself of the beauty of doing anything (though really, one does
it because once cannot figure out a way to to do it better!)

--
dorayme

Well this shows why IE is whacked:

http://www.littleworksstudio.com/temp/usenet/alt.html.20070406.png
alt.html.20070406.png (PNG Image, 719x442 pixels)

IE's value for bodyElement's offsetWidth *includes* the window's
scrollbar, part of the browser chrome! Whereas other browsers, here
Seamonkey, do not. So where 6 thumbs should fit IE can on fit 5, hence
the error.

Either have to fork for IE to subtract width of scrollbar width in the
calculation , not good because maybe MS will change this and also what
if you only have a handful of thumbs and no scrollbar?

Or look for another way to calculate the number of thumbs in a row...

Or, my vote, screw'em! They are using IE they deserve it! :-D

You could go with it and at least folks will decent browsers will get
the benefit. It is not like it destroys the page!

Who knows? I already have discovered IE7 has its own *unique*
bugs...eeewwoooo the MS-Zone....

I'll fool with this a bit and see if there is a workaround for IE

Okay in IE the clientWidth is the BODY - the scrollBar wide so the value
to calculate from is now constant with other browsers! So revised
function

function centerMe(){
var clientWidth=document.documentElement.clientWidth;

var count=parseInt(clientWidth/thumb);

//left margin calculated
var left=parseInt((clientWidth-width)/2);
//grab the wrapper DIV
var wrap=document.getElementById('wrapper');
//style it

Great! But guess what? Even though there is room IE always puts 1 less
thumb across! Bugger! IE does not do floats...

Now if you do browser sniffing and insure you got IE and not Opera
(which can to this all correctly I must add) you could add 1/2 the thumb
width allotment to balance the margin...

function centerMe(){
var clientWidth=document.documentElement.clientWidth;

var count=parseInt(clientWidth/thumb);

//left margin calculated
var left=parseInt((clientWidth-width)/2);

//Use so sort of browser sniffer to IS a IE only!
if( IsIE ) left+=(thumb/2); //add 1/2 thumb for IE only

//grab the wrapper DIV
var wrap=document.getElementById('wrapper');
//style it

--

Position:relative;float:left; extra div, Centered with Javascript.

[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloat.html
[/url]

--
BootNic Friday, April 06, 2007 9:12 PM

I had a monumental idea this morning, but I didn't like it.
*Samuel Goldwyn*

Ah, I see, that is interesting.

Of course.

Those with IE7 of course!

I will be all ... er.... antenae.

--
dorayme

> Okay in IE the clientWidth is the BODY - the scrollBar wide so the value

>

...

Both these new functions now ruin the effect entirely in Safari!
Your first stab, 2 posts back, was good for many non IE.

It is a reasonable thing to want, to be able to wrap thumbnails
and to centre the mass of them with or without big left and right
margin. Pity it is so hard!

--
dorayme

This is not centering the mass of thumbnails in Safari:

<http://members.optushome.com.au/droovies/pics/inSafari.png>

In FF it works well.

In iCab it half works. (It plays silly buggers at some window
widths).

--
dorayme

> [url]
> http://home.earthlink.net/~bootnic/JavascriptCenterFloat.html
> [/url]

I can now see it works in IE 6 too. But still not in Safari.
Perhaps this is a basis to work something out: to talk to IE with
a conditional, to use something like JLs first javascript fix for
the rest?

--
dorayme

Another go with a different approach. I don't have access to anything
that will not run on windows, so give it a go and see what it breaks.

[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloatII.html
[/url]

--
BootNic Saturday, April 07, 2007 12:58 AM

Hackers make toys. Crackers break them.
*Peter Seebach*

As before really, it works fast and furiously in FF, I assume it
works in Windows (I have my Winbox off now). But, I am afraid
that in Safari, the screenshot I made before pretty well applies
again.

--
dorayme

> http://home.earthlink.net/~bootnic/JavascriptCenterFloatII.html

I would have to make you a movie to demo what happens in iCab!
After loading and the JS kicks in, all the material disappears
leaving the wrapper border only beautifully visible and centered
(not that you can get to see the top _and_ bottom borders
together in a screenfull)

--
dorayme

Added a display toggle at the end of the function, that use to work on
some of the older mozilla browsers. I have no clue if it will do anything
for iCab.

--
BootNic Saturday, April 07, 2007 3:53 AM

"So tell me, just how long have you had this feeling that no one is
watching you?"
*Christopher Locke: Entropy Gradient Reversals*

> Added a display toggle at the end of the function, that use to work on

Still no go in Safari.

--
dorayme

Looked nice, seemed to work in IE, but while I was testing scaling the
window did hang IE on my Win2K box... Not sure what happened.

I did not round to whole numbers, I would guess that IE, and maybe
other browsers, may get stuck in a loop trying to render that.

The other example is similar, but I did remember to round the numbers,
does it hang as well.

--
BootNic Saturday, April 07, 2007 10:08 PM

Does this mean that iCab is now happy with it?

I will try one more time, try to add a check that tries to calculate the
possible width similar to what I think Jonathan was doing.

I think I must be going insane, I am going to try to write a script for a
browser I don't have access to, and know nothing about.

It may be a short trip.

--
BootNic Saturday, April 07, 2007 10:15 PM

Our earth is degenerate in these latter days; bribery and corruption
are common; children no longer obey their parents; and the end of the
world is evidently approaching.
*Assyrian clay tablet 2800 B.C.*

[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html
[/url]

--
BootNic Saturday, April 07, 2007 11:02 PM

Man who fight with wife all day get no piece at night.
*Ancient Chinese Proverbs*

It does not work on either Safari or iCab. The details:

Required:

(1) The floated divs wrap when room to fit them runs out.

(2) The the mass of divs are centered

In iCab on anything much less than a 20" at 1600 x 1200 it fails
on both (1) and (2).

In Safari, it fails in (2) on any screen at any width.

You should really stay there and work it out till you have
revolutionalised this sad little corner of html/css! (grin>

Otherwise I am left with JL's nice js which I have fully adapted
to a website already, to landscape divs of 200 wide, to portaits
of 150 wide and to "movie strip" divs of over 350 wide and all
working beautifully on browsers available to Mac (and very
impressive browsers too).

--
dorayme

> http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html

Hey, now this works in Safari! And, if one waits a sec for a bit
of a reorganization as the script bites, in iCab too (with a
reservation). The reservation: in iCab, it is as if a min width
to the wrapper or whole body has been set at 800. At just about
800, the horiz bar comes on. It is not my browser setting, the
url I gave at the start has no tendency to this in iCab.

Now, does it work in Windows IE? This is an important question,
more important than fun and games in iCab.

Just for now, I cannot test it on Windows. But surely JL will
report back. I will be able to look later today or tomorrow.

--
dorayme

Vacation is over, resolution achieved all that's left is to empty the
trash. ;-)

--
BootNic Sunday, April 08, 2007 12:13 AM

It is better to die on your feet than to live on your knees!
*Emiliano Zapata*

Good thing I checked to see if my last message made it to the group,
was just about to take out the trash, but, for the moment I put it back
on the curb.

Pages deleted and restored never got too close to the shredder lol.

--
BootNic Sunday, April 08, 2007 12:20 AM

"No man's life, liberty, or property is safe while the legislature is
in session."
*Judge Gideon J. Tucker, 1866.*

Not sure if you have read the latest about it all working in
Safari and well enough in iCab except for a small reservation? I
hope you realise I appreciate it. If it works out in Windows, I
will have to look to adopt it.

(btw, about acknowledgement: I trust that a comment on the top of
the linked js file I used so far that JL suggested:

//the original js was written by Jonathan Little, I have just put
in some figures and names to suit my purpose

is enough acknowledgement. Or does JL want more details? And if I
use your idea, you want me to say "Bootnic"?

--
dorayme

Works on xp home sp2, FireFox 2.0.0.3, SeaMonkey 1.1.1 , Opera 9.10,
IE 6, IE 7.

Maintenance could turn out to be a nightmare depending on the style
changes.

If the one you are using works, and works on the browsers you choose
to support, why change it.

I am not concerned with acknowledgement, this is just a pastime for
me. I would be just as happy to save that tiny little bandwidth and not
download it.

You are completely free to do with it what you will, play with it,
learn from it, use it, modify it, sell it, ignore it or anything you can
think to do with it.
--
BootNic Sunday, April 08, 2007 1:30 AM

Why is it that our memory is good enough to retain the least
triviality that happens to us, and yet not good enough to recollect
how often we have told it to the same person?
*Francois de La Rochefoucauld*

<blush> Enough acknowledgment, I was just interested the the puzzle...

Yes, indeed, yesterday evening I saw it worked on IE 6 on SP2.
This is a good thing. I have told you it is good in Safari, and
the odd thing with iCab...

I have not actually looked at this, with JL's it was easy to
adapt because it did a simple enough job of calculating and one
can put in ones own figures and adaptations.

For the reason it does not work well in IE. See earlier in thread.

--
dorayme

in that case, be thankful that your name did not figure in
flashing lights on the website proper instead of in a comment in
a linked js file which only geeks will see! <g>

I adapted your js for some portait thumbs (150 wide by 200 wide)
and this worked well in IE. So too a page where I have thumbnails
for movies, strips of about 530 wide (yes, looks good and 2 such
thumbs can get onto a big screen and be centered nicely). But not
so good on 200 x 150 landscape thumb page. If you really want to
see, email me, this particular set is a bit private. Otherwise
simply use the bare bones thumb page url I made at beginning of
thread and use 200 x 150.

Bootnic's js code works on Bootnic's url. To adapt I will
consider things. Yours was nice and simple and did not alter my
css so much and so was easier to adapt. I have no idea how much
his depends on his margin and paddings till I try.

Truth is, all this is a bit of an exercise for me too,
considering uncentered is not all that bad. It is just that in
some particular cases (like the wedding pages I have just made)
it looks the right thing to do as a finishing thing.

--
dorayme

I like code that is nice and simple that does complicated things.
Unfortunately I find IE produces the opposite and is an endless source
of frustration, especially since problems can show up so *unpredictably*

Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE. When I
adapted it to my designs, it played up a bit with scroll bars
mysteriously appearing at the bottom of the window but in
addition to chrome ones in Safari. So I deleted the bits to do
with overflow. I have no idea yet whether this has now mucked up
its big saving grace for me, ie, working in Windows IE. This I
have not tested. But it seems fine to me in all my Mac browsers.
Mac IE is unfazed and ignores the centering js code. That's ok,
at least it floats things right.

But, interestingly enough, at least for me, was that it did not
at all seem difficult to maintain or adapt. If you go to:

http://tinyurl.com/2a434t

you can see the efforts. The actual linked js has not been
changed from page to page (there are three pages to demonstrate
different format thumbnails and can be gotten to by the very
bottom link on the above url).

I would appreciate it to know if these pages look problmatic in
IE on Windows 6 or 7. I can test on 6 later.

--
dorayme

Does not work in win IE 5 either, its the margin auto thing.

If you're not using a border the it should be fine without the overflow,
or you could change it to hidden to remove the scroll bars.

You need to give #wrapper a border-width, can be 0, but it has to be
set to a number in px to avoid an error and script failure. With out being
set, IE sends Medium, which returns NaN and mucks up everything.

alert(parseInt('Medium'))

Give #wrapper a small padding, say 3px, without the padding at my
full screen (1280X800) IE 7 gives a horizontal scroll bar and hides just a
bit of it to the right.

With them two items added to the css, it works fine on winxp sp2 IE 6,
IE 7, FireFox, Opera and SeaMonkey.

--
BootNic Sunday, April 08, 2007 9:43 PM

Humor is emotional chaos remembered in tranquility.
*James Thurber*

OK, thanks, what about now that I have added:

#wrapper {border: 1px solid #fff; padding:3px;}

to the css? Can the border be simply border:0 or do "px" have to
be mentioned for these popular browsers?

--
dorayme

> If you're not using a border the it should be fine without the overflow,

Just another note to add, I have found that using your original
js, (unaltered by me) with the new wrapper css is also good for
Safari re scrollbars; in other words, longer do I get unwanted
scrollbars with the original js now in Safari.

--
dorayme

Just border-width:0; would do. Just to change the default that a
browser may have set such as IE has, maybe others as well.

Most browsers only use the part of the script to calculate the width to
compare it to the float width, but if the border is not set then the
script halts at the error and no centering takes place.

In the my example III, I added a visual aid to see which centering
method was being used, named pass and fail. The default text was set
to black, the pass class color was set to blue, and the fail color was set
to red. I use that so it would show up on browserShots for the browsers
I did not have access to.

if(w<=check+10){w=w+'px';wrap.className='pass'}
else {w=check+'px';wrap.className='fail'}

In the above snip of code it would be safe to remove the className
part of the script.

wrap.className='pass'
wrap.className='fail'

The overflow part of the script was used to drag the #wrapper down
to enclose all the floats, If you're not setting a different background color,
background image or a visible border, they can remain omitted.

--
BootNic Monday, April 09, 2007 9:11 AM

All my humor is based upon destruction and despair. If the whole
world was tranquil, without disease and violence, I'd be standing on
the breadline right in back of J. Edgar Hoover.
*Lenny Bruce US comedian, satirist, author*

Still seems to hang IE6. Interestingly enough it only seems to crash the
IE component and not the whole shell... but it does hang it if you
change the window size just a couple of times.

It does not hang IE 5.5 or 5.01, but it doesn't work either. IE5x does
work in mine either, the css causes those browsers to stack all the
thumbs in a single column!

Safari has an issue with the float, I have not been successful in
researching it, a float that contains floats, does not seem to shrink. I
do not have access to Safari, so this is just a guess from the little
information I was able to find, and what appeared to be the case from
browserShots.

That is the part of the script that was added to compare a caudated width
with a float with.

Currently the script checks both all the time, the script could be greatly
improved if someone with Safari would be able to create a quick test
for the float width issue and save that in a variable, and then use just one
method or the other to do the centering.

--
BootNic Monday, April 09, 2007 9:23 AM

One must learn by doing the thing, for though you think you know it,
you have no certainty until you try.
*Aristotle*

I haven't been following how you're doing the centering, so I'm not sure
if this is what you're talking about, but an auto-width float that
contains a lot of smaller floats (enough that they need to flow
underneath each other) should occupy the whole available width.

I hope I did not mislead you. When I said that your original js
was working fine too, I meant (I am sure this was not clear, my
bad) simply that your latest version (after the original trouble
with your first offering) works for me in Safari and other
browsers whether or not I remove the bits about the overflow.
That was all. I have removed them still but I will also put up a
version where they are left in shortly for anyone interested in
this stuff to compare the effects.

You know, of course, that I do not float the wrapper in any of
the 3 pages. The only floats are the little divs containing the
pics and captions.

--
dorayme

I am surprised to hear this, especially since i just started my
Winbox, and it is Win2000 as it happens (like yours) and

http://tinyurl.com/2a434t

is as robust as can be in IE 6. No matter what i do it works and
I have never been to this address on this machine since I made
it. I can resize windows, restart them, everything without a
hitch.

So, I am a little puzzled now as to what to do. Before I remove
the bootnic.js I need to see some trouble for myself, just a
little glimpse, a taste. For all that I can see and test, it is
as stable as anything. I do not doubt you Jonathan, I am
wondering if there is any issue with your machine?

As I said to Bootnic, I will add three more pages to duplicate
what is at the above address but this time with the lines about
overflow (in the linked bootnic.js) that I deleted.

Shortly.

--
dorayme

Are you seeing any visual problem in any of your browsers (I know
you have no IE) at

http://tinyurl.com/2a434t

Do the mass of the little boxes center ok? Does anything become a
problem when you resize or do anything to your browser windows on
any of your browsers?

--
dorayme

Here is anther url, in which I have restored the line that I
deleted about overflow from bootnic.js.

http://tinyurl.com/2qfy35

The previous url was: http://tinyurl.com/2a434t

You can toggle between the two versions by simply adding a 1 or
removing it at the end of the "original non tinyurl" before the
.html

--
dorayme

OK.

OK

I can experiment later with this. I am not using a different
background for now, enough complications already! I will be well
pleased when everyone is having as little trouble as I am with
your js. It is working on all my browsers really well, also in
Win IE6 and also in IE 7 on a Vista machine.

I have even implemented this on a real thumbnail/enlargement set
of pages and ditto the success that I am seeing (no new
principles are involved to the demos in the urls here)

--
dorayme

That is what I thought Safari was doing, where the other browsers that
I have do not, they all shrink it.

--
BootNic Monday, April 09, 2007 7:24 PM

If the facts don't fit the theory, change the facts.
*Albert Einstein *

I have not been able to produce a hang in IE 6, but I made a few
changes to
[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html
[/url]

Put as much as I thought I could in variables. Added a second function
that calls a timeout to reduce how many time the main function is
called.

If this one hangs IE 6, I have no other ideals how to solve it.

--
BootNic Monday, April 09, 2007 7:38 PM

If you can learn from hard knocks, you can also learn from soft
touches.
*Carolyn Kenmore*

I just replaced the script you were using with what I hope to be a
improved version.
[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html
[/url]

I replaced the file rather then creating another page. I believe that the
new version is more efficient and does not get called as much.

Really noticeable on FireFox on winxp, does not resize the content until
I let go of the mouse button.

--
BootNic Monday, April 09, 2007 7:52 PM

Humor is just another defense against the universe.
*Mel Brooks*

> If this one hangs IE 6, I have no other ideas how to solve it.

No, this latest does not work in Safari and in iCab has a severe
prob. It works fine in Opera and FF.

I would like to get more confirmation that your previous effort
had any problems. JL is on dial up, I wonder if this has anything
to do with it? On my broadband, one can someimes see just before
the js kicks in and things snap into place... perhaps there is a
delay that is causing trouble on his machine?

--
dorayme

Centers OKAY but still hangs IE6

OK, but be nice to have some confirmation of this from not on
your machine, neither my Win2000 box nor a sp2 XP box 9 miles
from here on IE6 shows any hanging behaviour at all?

Did you try also:

http://tinyurl.com/2qfy35

where I restored something I snipped from bootnic.js ?

--
dorayme

Opps. That was my error, according to browserShots the JS did not
fire in Safari, I can tell because the text was black, I was expecting
it to be red.

BrowserShots does not have iCab, but I would guess it was the same
thing.

Waiting for the photo to see.

I do not think it has anything to do with connection speed, its JS driven
after it loads.

--
BootNic Monday, April 09, 2007 8:53 PM

Good communication is as stimulating as black coffee and just as hard
to sleep after.
*Anne Morrow Lindbergh*

In Safari it simply does not centre, the text is black. In iCab
now it is centering, the text is blue.

Apart from what was happening on Jonathan's Win2000 box, do you
see anything to suggest that:

either:

http://tinyurl.com/2a434t

or:

http://tinyurl.com/2qfy35

were not good?

--
dorayme

Fixed the issue I think.

[url]
http://home.earthlink.net/~bootnic/JavascriptCenterFloatIV.html
[/url]

IE fires the function more then once each time it's called, IE 6 2 or 3 time
IE 7 seems to be always 2 times.

The original script looked up the left and right margin and padding on
two elements each and ever time the script was fired. Looked up the
first div in #wrapper. Perhaps a few others that I can't recall at the
moment.

The latest version only looks them up the first time, and saves them in
a variable.

The original version would fire as many times as the browser called it,
for IE this could be a real problem, which I think is the issue, along with
all that looking up it had to do.

The latest version now calls a different function that sets a timeout. If
the function is called again before the time is up, it just resets the timeout
and saves a function call.

Added a document width check, checks the width since the last time
the function was called, if the width has not changed then it does not
call the function, no need to call it if only the height has changed.

All of these fixes, I would hope, increase the performance of the
script, and reduce the load on the browser.

I just hope I fixed a few things and not created more issues.

No, they appear to be fine on my system.

In-fact I was able to simply replace the js link with the new version and
worked just fine as well. No page edit at all except the js link.

[url]
http://home.earthlink.net/~bootnic/bsIV.js
[/url]

--
BootNic Monday, April 09, 2007 10:20 PM

Don't worry about people stealing an idea. If it's original, you will
have to ram it down their throats.
*Howard Aiken*

OK, I trust the latest is more efficient even though the greater
efficiency is not evident in practice on my machines, for some
time your js has acted beaut anyway. Now in Safari, it is fine
with the latest too.

OK. Let me add a third URL now of my three files with your latest
which all work equally fine on all browsers on my Mac. Safari is
fine now too with this latest, also iCab. Whichever way you look
at it, you have done extremely well and until CSS3, your js will
spread far and wide.

http://tinyurl.com/yplj5d

--
dorayme

No problemo...

It works fine on Konqueror, Opera and Firefox. But I see the JS checks
for window.addEventListener, but not for document.addEventListener. I'm
not sure whether it should or not.

That is not correct, that is the kind of mistake I make for trying to
type from a memory and auto select.

It should have been like Jonathan N. Littles snip and needs to be
corrected.

// attach events
if( window.addEventListener ) {
window.addEventListener('load',floatCenter,false); //legacy
window.addEventListener('resize',floatCenter,false);
} else if( document.addEventListener ) {
document.addEventListener('load',floatCenter,false); //proper
document.addEventListener('resize',floatCenter,false);
} else if( window.attachEvent ) {
window.attachEvent("onload", floatCenter); //IE only
window.attachEvent("onresize", floatCenter);
}

Tuck this away in a code snip so next time I make this mistake I may
be able to recognize it.

--
BootNic Tuesday, April 10, 2007 2:22 PM

Happiness for the average person may be said to flow largely from
common sense - adapting one-self to circumstances - and a sense of
humor.
*Beatrice Lillie (1898-1989) English comedienne*

> > Ben C <spam...@spam.eggs> wrote:

> >> http://tinyurl.com/2a434t

Things move fast. http://tinyurl.com/2a434t was superseded by:

http://tinyurl.com/yplj5d

in which I put in what I call bootnic4.js (the latest I had).
Are the above changes to be incorporated into this latest? And
how quite is the incorporation to go in http://tinyurl.com/yplj5d?

Should the lines:

if( window.addEventListener ) {
window.addEventListener('load',checkCenter,false);
window.addEventListener('resize',checkCenter,false);
} else if( document.addEventListener ) {
document.addEventListener('load',checkCenter,false);
document.addEventListener('resize',checkCenter,false);
} else if( window.attachEvent ) {
window.attachEvent("onload", checkCenter);
window.attachEvent("onresize", checkCenter);
}

be _replaced_ by your above?

--
dorayme

I have had a go at what seems to me the replacement looking at
the conditionals and have the latest at:

http://tinyurl.com/33w8gm

Is this right? It works fine in Safari and iCab.

Just btw (or not btw?), iCab is ok up to a point, but it has
always exhibited the following odd behaviour: Centering is fine
on load or refresh. But if one simply alters the window size
down, it is as if the design has a min-width of "as big as it was
before the window resize"! The scrollbars come up etc. All shakes
down fine on refresh. No big deal of course.

What I want to know is if http://tinyurl.com/33w8gm is ok in IE7
and 6 now?

--
dorayme

[snip]

[snip]

I believe these are the same, the second one is just lacking the
comments.

They differ in that in one you have checkCenter while in the
other it is floatCenter. But perhaps I am getting confused now?

Simpler question: Is bootnic5.js at http://tinyurl.com/33w8gm ok?
Have I got it right and taken your latest into account? As I say,
it works fine in Safari and iCab.

--
dorayme

It sounds like maybe the onresize in not fireing. Only a guess I don't
iCab to check it out.

If you wish, I could just not use the onresize, just let the function
run on an iterval, and retun it if the width does not change.

Oh what the heck. Version that uses an interval.
[url]
http://home.earthlink.net/~bootnic/bstime.js
[/url]

All still seems fine on my system.

Opera showed up the a issue on http://members.optushome.com.au/droovies/thumbnails/thumbFilmStripGallery5.html
scroll the window too small and it seems to disapear.

Added a min with check within the script.
[url]
http://home.earthlink.net/~bootnic/bsIV.js
[/url]
has been updated.

--
BootNic Tuesday, April 10, 2007 8:21 PM

Get your facts first, and then you can distort them as much as you
please.
*Mark Twain*

I suppose I have been looking at this script way too long, did not see
that either.

Yes they are fine with the exception of the min with issue in my
other post.

Does the resize issue with iCab remain?

--
BootNic Tuesday, April 10, 2007 8:26 PM

This one "fixes" that resize issue but at the cost of the
centering no working at all either in iCab or Safari! I won't
post the example unless anyone really wants me to.

--
dorayme

STOP! My bad, I forgot to add a .js in my trial. It works fine
now in both Safari and iCab and yes, that resize problem is no
longer showing up in iCab. Well done.

--
dorayme

Time for me to walk away from this for a while, making way too many
mistakes.

The script was intended to use a timeout not an interval.

This is the last correction or update I am going to make to this script.
[url]
http://home.earthlink.net/~bootnic/bsV.js
[/url]

The bstime.js I posted in one of my other messages is just fine...I think.

--
BootNic Tuesday, April 10, 2007 8:53 PM

That's a nice one! I see it on my Mac Opera too.

OK, now my latest with your latest is:

http://tinyurl.com/2j73ba

and no Opera or iCab issue and all seems fine on my Mac (till I
test or hear about Windows, I don't know about WinIE).

--
dorayme

Well, no problem BootNic, you must know that I have been _plenty_
happy with your scripts for quite some time.

--
dorayme