Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

change height, width values based on variable in react-simple-image-slider

i am implementing an image slideshow kind of thing in react using npm package – react-simple-image-slider.

implementation->

export default function Home(){

const images = [
    { url: "images/1.jpg" },
    { url: "images/2.jpg" },
    { url: "images/3.jpg" },
  ];
const open = true;

    <SimpleImageSlider
                  width={`${open ? 896 : 880}`}
                  height={`${open ? 430 : 440}`}
                  images={images}
                  showBullets={true}
                  showNavs={true}
                />
}

i am trying to change height, width based on a variable. but this doesnt load anything. page is empty. am i missing something. please help.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

you can try passing in numeric values directly and conditionally set them like follow code, I think it will work as expected.

<SimpleImageSlider
  width={open ? 896 : 880}
  height={open ? 430 : 440}
  images={images}
  showBullets={true}
  showNavs={true}
/>

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading