Hi, I just purchased floatbox today and would like a few issues sorted out. I have not been able to sort these out through the instructions or demo page.
Most of the pics I'll be using floatbox for will be larger than the screen size and I would like floatbox to open in a width of say 900px and height of 600px withe the ability to scroll through the rest of the image or drag it around inside the box to see the hidden areas.
However, I would like to do this once in the header instead of individually for each image using the floatbox effect.
For the images that are not that large or vertical and do not need to be fitted inside the box I would like them to display as a regular floatbox effect.
Can these things be done and how, as I am not a programmer, I request you to give me clear instructions.
Automating floatbox
Page: 1
| Author | Post |
|---|---|
|
#1 Sun Mar 03, 2013 11:36 am
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
|
|
#2 Sun Mar 03, 2013 12:04 pm
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
The default behaviour when showing images is to scale the images down to fit the screen if they are larger than the current screen size. When scaled down, they can be enlarged to their native size by the user with a mouse click or touch. You don't need to set or modify any settings to get this behaviour, and this sounds like the behaviour you are looking for.
|
|
#3 Sun Mar 03, 2013 12:52 pm
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
I am looking for the floatbox size a little smaller than the screen size and the large image to show up in it. The user can drag the image around in the box to see the hidden areas of the full picture.
In my current configuration even though the image takes up 960px width of the screen I need to scroll down in the entire page to see the rest of the image. I want to scroll within the box area. |
|
#4 Sun Mar 03, 2013 1:23 pm
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
Well, the starting floatbox is already a little smaller than the screen. 5px smaller to be exact. This is conrolled by the autoFitSpace option. Set that to, say, 100 if you want a minimum of 100px free around the box.
When images are auto-fit to the screen, they are initially displayed in their entirety at their reduced dimensions. It is up to the user to expand the image, at which point default behaviour is for the image to grow inside the floatbox, but the box to remain at its current size, and the image can subsequently be dragged around inside the box. This last behaviour is controlled by the inFrameResize option. There is no chance that, if the default autoFitImages and inFrameResize options are in play, you have to scroll the page down to see any part of the image. |
|
#5 Sun Mar 03, 2013 3:14 pm
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
Do they need to be true or false? I see that having these as true doesn't resize the box to scale the image but just scales the image inside the box size. |
|
#6 Sun Mar 03, 2013 3:31 pm
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
I'm sorry, but I don't understand what you're getting at. Here's the blurb for those two options from the Options Reference:
|
|
#7 Sun Mar 03, 2013 5:08 pm
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
I get it now. I need inFrameResize to be False when autoFitImages is set to True.
Thanks for the great support. |
|
#8 Sun Mar 03, 2013 5:14 pm
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
Maybe.
You started this post by saying you didn't want to scroll the page but wanted to instead drag the image around within a static box that remains entirely within the visible screen area. That's exactly what the default setting of inFrameResize:true does. When you set inFrameResize to false, then when the user enlarges the image to its full size, the surrounding floatbox enlarges along with it, generally becoming bigger than the visible screen and necessitating the use of page scrolling to see everything. Why not try it both ways and see what you prefer. |
|
#9 Sun Mar 03, 2013 6:16 pm
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
I know but what was happening was that when I had inFrameResize:true then the picture was enlarging within the small width it had shown up in initially. I wanted the frame to become nearly as wide as the screen and not grow in height so the picture would fill up the width but the height would be draggable.
My first preference would have been to blow up the image to nearly screen size and be draggable within it. This would be done to images that exceeded the screen size while the smaller images would be shown as normal floatboxes. Am I making sense here? |
|
#10 Sun Mar 03, 2013 6:28 pm
|
|
|
Administrator
Registered: Aug 2008
Posts: 3382
|
I think what you are saying is that when a user clicks to resize a box up from its current auto-fit dimensions, you want the floatbox frame area to grow bigger, but not all the way to the size of image's native dimensions. Maybe to half-way between the auto-fit size and the native size, or something like that. If that's an accurate description of what you're attempting, give up and move on to something more productive. Floatbox can't be made to do that. The floatbox frame will either stay at it's auto-fit size if inFrameResize is true, or will grow to the image's full size if inFrameResize is false. There's no middle way.
|
|
#11 Mon Mar 04, 2013 11:52 am
|
|
|
Member
Registered: Mar 2013
Posts: 11
|
That is exactly what I was looking for. But no issues if floatbox can't do that. I'm happy with what I am getting now. Will be troubling you later for advices on tooltips etc.
|
Page: 1