search

bqworks / slider-pro

A modular, responsive and touch-enabled jQuery slider plugin that enables you to create elegant and professionally looking sliders.
MIT License
876 stars 387 forks source link

Conditional Images #311

Closed markcrisell closed 4 years ago

markcrisell commented 4 years ago

I cannot get this to work.

In my properties I've got:

$( document ).ready(function( $ ) {
    $( '#example3' ).sliderPro({
        width: 960,
        height: 500,
        fade: true,
        arrows: true,
        buttons: false,
        fullScreen: true,
        shuffle: false,
        smallSize: 500,
        mediumSize: 1000,
        largeSize: 3000,
        autoplay: false
    });
});

And my writeup:

            <img class="sp-image" src="../src/css/images/blank.gif" 
                data-small="small.jpg"
                data-medium="medium.jpg"
                data-large="large.jpg"
                data-retina="large.jpg"/>

If I test it using a DevTools on Chrome on a desktop and set the window size it appears to work flawlessly. But open it on my iPhone SE and I always see the large image?

markcrisell commented 4 years ago

Sorry. I'm being a plank. "Retina" over-rides the small/med/large.

I removed that and it's fine.