I have set up VS with the below settings. I have inserted this into a drop-down menu to allow users to navigate groups of content from one menu item. The module works perfectly (thank you) but only after I specifically mouseover an item other than the slide that is the default. ie I get a list of navigable items on the left but blank space on the right until I mouseover the 2nd or 3rd (for example) item in the nav list. At that point the right-side populates correctly. If I return to the default slide then the hover it triggered and the right-side populates correctly.

I've discovered that once the page loads, the height of the first item is not being correctly set - ie it is 0. If I manually set this in a separate JS file or from the console then the first slide correctly displays and then the automatic sizing takes over correctly. I've used this code to do this:

$("class of views block").animate({height: 400})

Is there a setting that I've missed to get the first slide to correctly auto-size and therefore show?
Or, if I'm stuck with manually setting the height for the first slide, how can I calculate/read what the height should be because as I need auto-size this needs to be done on the fly and I can't work out where it is being read from or calculated as from looking at the code, the height is only calculated when I hover over a navigation item?

Any help would be really appreciated.

Many thanks,
Crom


 "viewsSlideshowThumbnailHover": { "#views_slideshow_thumbnailhover_main_sg_menu_groups_by_cat_tax_list-block_1": { "num_divs": 7, "teasers_last": 1, "id_prefix": "#views_slideshow_thumbnailhover_main_", "div_prefix": "#views_slideshow_thumbnailhover_div_", "vss_id": "sg_menu_groups_by_cat_tax_list-block_1", "view_id": "sg_menu_groups_by_cat_tax_list-block_1", "timeout": "0", "sort": 1, "effect": "scrollHorz", "speed": "400", "start_paused": 1, "fade_value": 0.25, "hover_breakout": "teaser", "hover": "hover", "main_fields": { "phpcode": "phpcode", "name": 0 }, "breakout_fields": { "name": "name", "phpcode": 0 }, "delay": "4000", "fixed_height": "0", "random": "0", "pause": "2", "pause_on_click": "0", "pause_when_hidden": 0, "pause_when_hidden_type": "full", "amount_allowed_visible": "", "remember_slide": 0, "remember_slide_days": "1", "pager_event": "mouseover", "controls": "0", "image_count": "0", "sync": "1", "advanced": "", "ie": { "cleartype": "true", "cleartypenobg": "false" }, "nowrap": "0" }, "#views_slideshow_thumbnailhover_main_sg_menu_groups_by_category-block_1": { "num_divs": 54, "teasers_last": 0, "id_prefix": "#views_slideshow_thumbnailhover_main_", "div_prefix": "#views_slideshow_thumbnailhover_div_", "vss_id": "sg_menu_groups_by_category-block_1", "view_id": "sg_menu_groups_by_category-block_1", "timeout": "5000", "sort": 1, "effect": "scrollHorz", "speed": "300", "start_paused": 1, "fade_value": 0.25, "hover_breakout": "teaser", "hover": "hover", "main_fields": { "field_group_image_fid": "field_group_image_fid", "title": "title", "posts_count": "posts_count", "name": 0 }, "breakout_fields": { "name": "name", "field_group_image_fid": 0, "title": 0, "posts_count": 0 }, "delay": "0", "fixed_height": "1", "random": "0", "pause": "1", "pause_on_click": "0", "pause_when_hidden": 0, "pause_when_hidden_type": "full", "amount_allowed_visible": "", "remember_slide": 0, "remember_slide_days": "1", "pager_event": "mouseover", "controls": "0", "image_count": "2", "sync": "1", "advanced": "", "ie": { "cleartype": "true", "cleartypenobg": "false" }, "nowrap": "1" } } });
//--><!]]> 

Comments

Crom’s picture

Category: feature » support
redndahead’s picture

Status: Active » Fixed

So in version 3 there is a setting to wait for all images to load which helps correct the problem. What you can do is use css to force the width and height by using !important.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.