CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Shamsur Rahman
Shamsur Rahman

Reputation: 283

Revolution Responsive jQuery Slider image width and height change

Inside the div with class slotholder is an image of class defaultimg with height and width added automatically. I want to change specially image height and width.

Here is the code:

<div class="slotholder">
  <img class="defaultimg" alt="" src="image.png" style="width: 1399px; 
height: 724.45px; position: relative; left: -25px; opacity: 0;">

I have tried to change width and height in css like:

img .defaultimg{
  width:1570px !important;
  height:813px !important;
}

But isn't working. How can I change this by CSS or jQuery?

Upvotes: 2

Views: 4342

Answers (2)

andreas
andreas

Reputation: 16936

If you want to change width and height of the slider, look into the documentation of the revolution slider script. There you'll find all the settings, including e.g. the gridwidth and gridheight options to set the size of your slider even for different viewport sizes.

So on initializing your slider, you could do the following:

jQuery(document).ready(function() { 
   jQuery("#your-slider").revolution({
      gridwidth:1570,
      gridheight:813 
    }); 
});

If you already initialize your slider with some settings, just add the gridwidth and gridheight options.

This is a more proper solution than trying to overwrite the generated styles with CSS !important declarations.

Upvotes: 3

DaniP
DaniP

Reputation: 38252

The problem is your selector:

img .defaultimg

Searchs for an element with class defaultimg inside an img (which isn't possible by the way)

What you need is the img element with class defaultimg remove the space like this:

img.defaultimg

Upvotes: 2

Related Questions