Reputation: 145
I am using the code below to create a scrolling text. The problem is that I have multiple divs which contains .vscontent
and I want to select the first of every .vscontent
in the different "div-trees".
Right now only the first .vscontent
of the first div is selected. How do I make this change happen to all of them at the same time?
Is there a .vs-content:first
which selects all the firsts?
$(function() {
var $this = $("#vs");
var scrollTimer;
$this.hover(function() {
clearInterval(scrollTimer);
}, function() {
scrollTimer = setInterval(function() {
scrollNews($this);
}, 1500);
}).trigger("mouseleave");
function scrollNews(obj) {
var $self = obj.find("#vs-container");
var lineHeight = $self.find(".vs-content:first").height();
$self.animate({
"marginTop": -lineHeight + "px"
}, 300, function() {
$self.css({
marginTop: 0
}).find(".vs-content:first").appendTo($self);
})
}
})
Upvotes: 0
Views: 60
Reputation: 4870
This should clarify how jq child selection work.
$("div p:first-child").addClass("active")
.active{
color:red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
<p>1</p>
<p>1</p>
<p>1</p>
</div>
<div>
<p>1</p>
<p>1</p>
<p>1</p>
</div>
<div>
<p>1</p>
<p>1</p>
<p>1</p>
</div>
<div>
<p>1</p>
<p>1</p>
<p>1</p>
</div>
Upvotes: 0