Creating a responsive drupal 7 slideshow


Tags: css,drupal,responsive-design,slideshow

Problem :

I've found a bunch of articles about how to create slideshows in drupal, and many that discuss making a slideshow more responsive on SMALLER screens...but I'm having trouble finding how to make a slideshow (with css or some other drupal module) that is responsive on LARGER screens (ie. what happens when the screen is larger in width than my initial image...how can I stretch it and make it look ok?)

For example, my image is 1000px wide. However, I want the slideshow to be the full width of the page. Thus I want the image to stretch to take up the full width of the page irrespective of browser size. But I also don't want the image to look poor.

Is there a standard technique (or any technique) to make this happen?



Solution :

try this bx_slider module Normally bx-slider.js create responsive slider.


    CSS Howto..

    CSS - How do I center a loading icon on a page that contains an iframe?

    How to disable a YUI MenuBarItem from markup

    How to change a button data-icon size

    CSS box-shadow shows weird white region?

    How can i give transparency effect in CSS?

    How to use CSS with JS [duplicate]

    How can I make a rounded image with a label in it?

    How do I wrap and set CSS properties to achieve the depicted results?

    How to load CSS on PC and Mobile by jQuery?

    What to do to align text as shown in the image using HTML and CSS?

    How I can replace an existing html val with a value calculated later using html and/or css?

    How to change parent element css-properties by clicking on his child without javascript

    How to create CSS for an existing web application that now is used in a Kiosk with touch screen

    How to fix an image compared with another one in CSS?

    How to position images next to text using CSS

    how to move scrollbar from left to right in css?

    how to combine multiple css class selectors for jquery buttonset?

    How to see the style of the thumb of range input in Chrome developer tools?

    How would you style a PHP suffix with CSS?

    Facebook Like Button - how to disable Comment pop up box?

    HTML / CSS: How to get fixed margin between body and footer

    How to apply class only for IE?

    How to add css to a HTML div which has no class or id

    AngularJS ng-show directive showing elements before hiding elements

    how to make this div margin to zero and more nature [closed]

    How to import css from libraries via postCSS?

    css: how to target p a img

    How to Write an Angular directive to update CSS class based on form validation

    How to override font-size (em) in this condition?

    How to auto-adjust size of other input fields while typing into input field #1?