Setting a Fixed Height in a Slide Show
Xabi - November 23, 2007 - 08:49
| Project: | Views Slideshow |
| Version: | 6.x-2.x-dev |
| Component: | Code |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed |
Description
When I set a block with views_slideshow, the height of the block change depending on the content showed, moving the rest of the blocks up/down, an ugly effect. Is there a way to keep the height of the slideshow block fixed?

#1
yes, I'm wondering this too. it would be very handy.
#2
you can do it with with css- open /themes/mytheme/style.css
add something like this at the bottom
#block-views-myblock {height: 250px !important; overflow: hidden;}
where block-views-myblock is the div id of your block, which can be found by highlighting the block, then rt-click - 'view selection source' (in firefox)
#3
This solution is not a very good!
What if have teasers in the slideshow and 'read more' link at the bottom, this 'read more' link would disappear.
The best solution would be to let the js highest element in the slideshow and set the wrapper to that height.
I will try to make a patch for D6 (I'm not familiar to D5, sorry!)
#4
I have created this patch that gives the option to have a fixed height of the slideshow block
#5
#6
Maybe a better status, sorry hehe :)
#7
Maybe I should not be assignee for code review
#8
What is this patch trying to achieve that CSS will not do?
The style height of the block can be set through your theme with one line of code. Content can be of all sizes and can easily get messed up unless you already know at least the maximum size of all possible content in the slideshow.
#9
This patch calculates the maximum height of any element in the slideshow.
Thereafter the resulting height is set with css ... as your solutions have done as well.
The patch also provides an option to enable/disable the fixed height, which is found in the "views setup" as a point'n'click feature.
#10
Another possible solution would be to add the slide-show to a mini-panel block, and hard code the INC. files within the "styles" folders under panels.
#11
Is there any chance that this feature could be implemented? It sounds very userfriendly especially for all folks not so comfortable with CSS.
#12
Would be helpful for non-programmers if there is a simple UI for setting block dimensions. It is present in Rotor module http://drupal.org/project/rotor .
#13
Sorry to say, I switched to Views Rotator - http://drupal.org/project/views_rotator - that allows to set the height and if no height is set it will attempt to calculate a fixed height.
The auto height calculation worked well for me and thus I will keep it for now.
I am sorry, because Views Slideshow looks great with all those controls.
I first made the switch because Views Slideshow suddenly stopped and seemed buggy - well simplicity is usually the better option.
I think for a slideshow the fixed height for blocks is paramount and it would be good to fix this quickly to get it out of the mind of the less programming minded users like me.
Good luck and thanks - I will keep the moduel active to stay in touch ....
#14
This problem is very easy to address if you use the imagecache module. Because so many people use imagecache it seems efficient that code solutions to fixed heights/widths would not be implemented in this module.
Solving the problem with Imagecache
First create a "preset" using the imagecache admin (admin/build/imagecache/add). Then, in Views, when you select the image field that you'll be using for the slideshow, there is a dropdown called, "Format." That dropdown will list the preset you've just made, and voila, no worry about bad sized pics ruining your layout.
Also note that there is a lot of work being done on this module --- currently you have to checkout the 6--2 dev from cvs and apply this patch from the following thread in order to see all the improvment, bug fixes etc. http://drupal.org/node/463254. But hopefully it will be downloadable from the project page soon.
Shai
Content2zero Web Development
#15
On my last comment I forgot I was here in the queue and I thought I was just doing a regular comment where you can add a title. I didn't mean to change the title of the whole thread.
Shai
#16
Thanks for the advice - I will try it out before too long.
#17
Shai,
thanks for the easy to follow note and guidance.
I tried your suggestion to realise this refers to images.
But my need is a combination. I am generating a show of certain details from the input of the sponsors / Advertisers. I use the logo (image field) and two text fields - of varying length - one with 9 lines, one with 2.
When this is put together in Views each produced image of the Sponsors details will look different from no logo and some lines of text to logo and all 11 lines.
At the end this combined view needs to have fixed height for the block in the sidebar. Views Rotator is doing this well right now. But there is another area where I will need just slides - so many thanks ... and more when I get to that little excersise ...
#18
Moving to 2.x
#19
I just want to request that there be a setting to opt-out of this! I was always able to fix the height using css on my site, but UN-fixing it is impossible if this patch is implemented. (which it appears it is) I don't want mine to be a fixed height, as I want my total column height to reduce as much as possible if it can, on some slides, since I'll only be switching slides very slowly.
Please provide a setting to disable this function if you would.
#20
@gregarios - I agree with your thought, I think generally this should be handled through css/theming and tools like imagecache. There is some value in having this be quite easy for non-coders/themers tho. If implemented it should definitely by optional.
#21
Yes. It is even more important to have it optional when you aren't just sliding images, but whole teasers or nodes. When you are sliding teasers, the height can vary quite a bit from slide to slide. When a fixed height is implemented, some teasers have a huge gap of space under them with a fixed height, while a dynamic height makes the rest of the column adjust and keep the gap from appearing.
#22
Since moving to jQuery cycle it seems to be fixed height by default. So this should be fixed in 2.x-dev
#23
Automatically closed -- issue fixed for 2 weeks with no activity.
#24
I just upgraded to 2.x, and the fixed height adds gaps to my block content. Is there a way to disable the fixed height? If not, would I need to install v1.x in order to prevent this fixed height from occurring?
Thanks!
#25
In the advanced settings box enter
containerResize: 0
#26
Thanks for the reply. I tried adding containerResize: 0 to the advanced box in the slideshow style for the appropriate view, and the block is still stretched to fit the maximum height. Any idea why this may not be working for me?
Thanks again for your help!
#27
I've been trying to figure this out as well. I've got an imagecache preset of 520px height for all images, yet all of the (div id="views_slideshow_singleframe_div_1_[slide#]") slides as well as the slideshow container (div id="views_slideshow_singleframe_teaser_section_1") are given a fixed height in their style="height: 525px;" inside both divs.
So, JavaScript is assigning the height of these DIV's, correct? I've tried putting both height: 520 and containerResize: 0 in the advanced settings box to no avail. Why are the 5 extra pixels added on to these two DIV's?
#28
I figured out what was causing my problem, at least -- it was my CSS: Setting line-height: 0px; fixed the issue.
#29
IncrediBody, Try this patch: http://drupal.org/node/632838#comment-2265562 and then set containerResize:false
If you still have issues please open a new issue.