Databases
StackOverflow2013
Postsdbo
POAccessing items in rcarousel that are not visible
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAccessing items in rcarousel that are not visible
    text
    copied!<p>I have a rcarousel with 3 visible items, and I when one clicks and item, a class is removed from all items and added to the one that is clicked. However, the only items that are in the DOM is the 3 that are visible. So, if the one that has the class in not visible, and the user clicks another item, and you scroll back to the previous one, there are two that are selected. How can I access the non-visible items to remove the class from those as well?</p> <p>Here is the HTML:</p> <pre><code>&lt;div id="seitemvideocarouselcontainer"&gt; &lt;div id="ui-carousel-prev"&gt;&lt;/div&gt; &lt;div class="seitemvideocarousel"&gt; &lt;div class="carousel-item"&gt; &lt;div class="videothumbnail"&gt; &lt;img class="seitemvideocarousel-90 selected" src="/images/library/videothumb/363303782_200.jpg" onclick="selectVideo(90)" title="Econom Recharge" alt="Econom Recharge"&gt; &lt;/div&gt; &lt;div class="videotitle"&gt; Econom Recharge &lt;/div&gt; &lt;/div&gt; &lt;div class="carousel-item"&gt; &lt;div class="videothumbnail"&gt; &lt;img class="seitemvideocarousel-84 " src="/images/library/videothumb/363159759_200.jpg" onclick="selectVideo(84)" title="Nalini Antares 12" alt="Nalini Antares 12"&gt; &lt;/div&gt; &lt;div class="videotitle"&gt; Nalini Antares 12 &lt;/div&gt; &lt;/div&gt; &lt;div class="carousel-item"&gt; &lt;div class="videothumbnail"&gt; &lt;img class="seitemvideocarousel-2420 " src="/images/library/videothumb/5g8RYa1Aams.jpg" onclick="selectVideo(2420)" title="Mucka Blucka b" alt="Mucka Blucka b"&gt; &lt;/div&gt; &lt;div class="videotitle"&gt; Mucka Blucka b &lt;/div&gt; &lt;/div&gt; &lt;div class="carousel-item"&gt; &lt;div class="videothumbnail"&gt; &lt;img class="seitemvideocarousel-2438 " src="/images/library/videothumb/TTqpEJh03fI.jpg" onclick="selectVideo(2438)" title="I Uploaded This Video!" alt="I Uploaded This Video!"&gt; &lt;/div&gt; &lt;div class="videotitle"&gt; I Uploaded This Video! &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="ui-carousel-next"&gt;&lt;/div&gt; </code></pre> <p></p> <p>Here is the rcarousel call:</p> <pre><code> $('.seitemvideocarousel').rcarousel({ orientation: 'vertical' , visible: 3 , width: 150 , height: 120 , start: onCarouselPageLoaded , pageLoaded: onCarouselPageLoaded }); </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload