Can't get Floatbox to work at all

Page: 1

Author Post
thrash632
Guest
Hi,

I'm trying to install floatbox on my website.

Go to barbarabrownsculpture.com.
Click on "The Art".
Click on "Bronze".

This is the only page I've tried installing it on so far. It's embedded in an iframe.

I've followed the install instructions but can't get it to work whatsoever. Any help would be appreciated.

Thanks.

-Adam
thrash632
Guest
forgot to mention that I was using lyteframe before, but switched over to floatbox.
Administrator
Registered: Aug 2008
Posts: 3382
I don't know what kind of horrible industrial accident happened on your site, but both floatbox.js and floatbox.css are corrupt (truncated actually). The real floatbox.js is 2458 lines long. Yours is 592 ?. The css is 384 vs. 128 ?. I can only assume that other supporting floatbox files are also trashed. Time to delete the whole floatbox folder, redownload, and install fresh.
thrash632
Guest
I tried re-uploading the files again, but no luck. Floatbox still won't work at all.

I noticed a slight difference in filesize for a few of the files. For example:

floatbox.css went from 16,595 to 16,212.

floatbox.js went from 94,164 to 91,707.

Even when I try to upload these files individually, it keeps reducing the file size for some reason.

I'm using FileZilla to connect via FTP. Any help would be appreciated, thanks.
Administrator
Registered: Aug 2008
Posts: 3382
The first problem is out of the way. The floatbox files are no longer corrupt. They are downloading completely for me.

Now onto the second problem.
Your pages are rendering in quirks mode and floatbox will not work on quirks mode pages. You need to put a valid doctype on your iframe content pages.

More info (but not much more) here

Oh, and don't worry about those small file size differences. That's just the difference between Windows' two character end-of-line codes and Unix's one character codes. Notice the way the size difference matches the line count?
« Last edit by admin on Fri Apr 03, 2009 4:43 am. »
thrash632
Guest
Thanks a lot for your help thus far. I never would have figured this stuff out on my own.

Unfortunately I'm not out of the woods yet :? I've used validator.w3schools.org on my index page and the page I'm using floatbox on (bronze.html). Everything seems to be setup fine. I have both pages set to transitional doctypes (I read that's what I need to do if I'm using an iframe, which I am).

Here's the exact doc type I am using on both pages:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Can't thank you enough again for all your help. Floatbox is really impressive and I can't wait to get it up and running on my site. :D
« Last edit by Unknown on Sat Apr 04, 2009 6:46 am. »
Administrator
Registered: Aug 2008
Posts: 3382
Yup, now your iframed sub-pages have valid doctypes and we seem to be past the quirks-mode hurdle. But your floatbox install is still messed up. Where's the /floatbox/graphics/ folder? You need to unzip everything from the download into the /floatbox/ folder at the root of your site, including the sub-folders and their contents from the zip file. You should end up with 3 sub-folders and their contents: docs, graphics and languages.
thrash632
Guest
I downloaded the zip file again and don't see any of the 3 sub folders you mentioned. It looks like everything is bunched up in the zip file, instead of being separated into 3 folders like you mentioned.

I downloaded the newest version here:

http://floatboxjs.com/download.php
Administrator
Registered: Aug 2008
Posts: 3382
I can't teach you how to use a zip client. I don't even know what client you are using. Some of them show all the files in one big list with the folder names off to the right beside them. These clients have an option somewhere to the effect of "unzip and keep/create the original folder structure". Look around for something like that in your client. If you're on a windows platform, try right-clicking on the downloaded zip file, select "open with..." and choose "Compressed (zipped) folders". Then you will get the familiar folder view of the zip file contents. Just drag the whole floatbox folder from there into the root folder of your site.
thrash632
Guest
Got it working. Thanks again :)

Page: 1