unslider container does not get position relative & overflow hidden styles #467

Open
creanodesign opened this Issue Dec 5, 2016 · 1 comment

Projects

None yet

2 participants

@creanodesign
creanodesign commented Dec 5, 2016 edited

Hello,

nice plugin!
For some reasons my container do not get styled with position relative & overflow hidden when the page renders.
It results in displaying horizontal & vertical scrollbars. Still the effect and plugin is working properly.

When I inspect the code on you demo I can see that container is dynamically styled with overflow hidden & position relative but not in my page...

HTML

<div id="bs-player__shop" class="bs-player__shop">
 <p class="bs-player__shop__title">Shopping list</p>
 <div id="bs-player__shop__carousel" class="bs-carousel bs-player__shop__carousel">
  <ul>
   <li>
    <img src="path/to/img" alt="" />
    <p class="bs-player__shop__pdt-title">Title</p>
    <p class="bs-player__shop__price">23,00 €</p>
    <a href="#" class="bs-player__shop__buy tween">Achat rapide</a>
   </li>
   <li>
    <img src="path/to/img" alt="" />
    <p class="bs-player__shop__pdt-title">Title</p>
    <p class="bs-player__shop__price">23,00 €</p>
    <a href="#" class="bs-player__shop__buy tween">Achat rapide</a>
   </li>
   <li>
    <img src="path/to/img" alt="" />
    <p class="bs-player__shop__pdt-title">Title</p>
    <p class="bs-player__shop__price">23,00 €</p>
    <a href="#" class="bs-player__shop__buy tween">Achat rapide</a>
   </li>
  </ul>
</div>

JS

`jQuery('#bs-player__shop__carousel').unslider();
var scripts = [
	'http://stephband.info/jquery.event.move/js/jquery.event.move.js',
	'http://stephband.info/jquery.event.swipe/js/jquery.event.swipe.js'
];

jQuery.getScript(scripts[0]);

//  Once our script is loaded, we can initSwipe to add swipe support
jQuery.getScript(scripts[1], function() {
	jQuery('#bs-player__shop__carousel').unslider('initSwipe');
});`

FI: JQuery, event.move, event.swipe & unslider.js are correctly link to the document and in the right order.

CSS
Regular CSS of the plugin.
FI: prev/next arrows are then positioned in absolute.

Do you have an idea?

Thx
N

@diiaann
diiaann commented Jan 5, 2017 edited

I'm having a similar issue, did you end up figuring it out?

EDIT: NVM, my issue was that I was misplacing my .my-slider class on the ul, not the div parent.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment