How should I set the width of the slideshow to fill the full width of the block? I tried using containerResize, slideResize but I failed to do so.
In the attached image you seen the problem, in red is marked the desired width.

Thank you and sorry for my english (I spanish native)

CommentFileSizeAuthor
slideshow.JPG32.75 KBcgf_ar
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

general_ludd’s picture

I am having the same problem. The width of the slideshow is arbitrarily 854px when I want it to be 890px. I can't figure out where in the code this element declaration is taking place.
style="position: relative; width: 854px; height: 320px;"

benjaminkyta’s picture

Give this a try. I might fit your needs:
Go to your view with the slideshow, On slideshow settings, navigate to jQuery Cycle Custom Options. Under the Advanced Options, select width. Fill in 890 in the Advanced Option Value [Note: You dont have to put "px or %" because it will default to px. Thats how it works]
Click the link just below "Update Advanced Option"
Under APPLIED OPTIONS, your with will be there.
Apply the changes

You can do the same for Height and many more options. Hope its what you want.
@ cgf_ar You will need to first measure the width of the container and then specify it in the Advanced Option Value. FireBug or Inspector for Chrome can be of help to figure out the best width.

mountbatten.net

Technikal’s picture

Hi benjaminkyta, how does one have a slideshow's image span beyond say 960px ? using an omega subtheme - thank you in advance

jcollins12498’s picture

Priority: Major » Normal

The width doesn't appear to work. I followed the instruction given by benjaminkyta above and found that, while the width custom option can make the width smaller, it does not make it larger. In my example, I was building an announcement view. The view only displayed the body field. The intention of the view is to take the entire width of the page an be above the main content. Everything works fine if the body text is sufficiently long to take the entire width. However, if it is shorter than the width, there appears to be no way to make it expand.

I set the value of the width to 950, and only got a width of 163 (the width necessary to fit the text). When I set the width to 100, it did adjust the width down to 100.

graemian’s picture

I'm having the same problem. The advanced settings seem to cap the maximum width, but not the minimum width:

div id="views_slideshow_cycle_teaser_section_feature_slideshow-block" … width: 738px; height: 337px; "
div id="views_slideshow_cycle_div_feature_slideshow-block_0" … width: 662px; height: 337px; "

/div
div id="views_slideshow_cycle_div_feature_slideshow-block_1" … width: 738px; height: 280px; "

/div
/div

I tried to have a look at the code, but it's not easy to figure it out. Any other suggestions before I dive in for a longer look at the code?

Tx,
G

joelrichard’s picture

I thought I'd throw this out there. It worked for me... but it's ugly. From what I can tell, we're seeing with issues with jQuery itself, or an interaction between this module and jQuery and this is just a hack.

Add this to your CSS. This is a global change and will affect all of your slideshows on your site.

.views_slideshow_cycle_main .views_slideshow_slide {
	width: 100% !important;
}

This will cause each of the slides (not the parent container with the style="width: 459px" (which is what I had before) to be 100% wide which seems to achieve the desired effect. Your mileage may vary.

Woah, Looking at this more, it actually affects how jQuery is setting that width: 459px. Now it's width: 700px (which is the size of the space in question.) I didn't follow benjaminkyta's instructions since they did not work for me.

I propose that this CSS be added to the default css for the module, but I'll let the developers think about that. :)

aldrichong’s picture

Title: the width of the slideshow does not occupy the full width of the block » Thanks it worked

Thanks your css worked

chapabu’s picture

Title: Thanks it worked » Tthe width of the slideshow does not occupy the full width of the block

Changing title back so it's more useful if anyone needs this in the future.

jaesperanza’s picture

Title: Tthe width of the slideshow does not occupy the full width of the block » The width of the slideshow does not occupy the full width of the block
Issue summary: View changes
NickDickinsonWilde’s picture

Status: Active » Closed (won't fix)

I'm thinking this is predominantly a theme issue that depends on usage/theme/how you want it to display - I'm open to be convinced otherwise ofc but for now setting to won't fix - but thanks for the discusion/reporting.

veerakolagani’s picture

$("aside").removeClass("container");
use this on ur custom js

samhaldia’s picture

This CSS works for me for Drupal 8:

.views_slideshow_cycle_main .views_slideshow_cycle_teaser_section {
    width: 100% ! important;
}

.views_slideshow_cycle_teaser_section > .views_slideshow_slide {
    width: 100% !important;
}
benjarlett’s picture

I needed to add this...
.views_slideshow_cycle_teaser_section > .views_slideshow_slide {min-width: 300px;}