I need to apply bounce property on both left and right well's using nth-child... I m not getting it.
See original GitHub issueChallenge Target a Specific Child of an Element Using jQuery has an issue.
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.106 Safari/537.36
.
Please describe how to reproduce this issue, and include links to screenshots if possible.
My code:
<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target1").prop("disabled", true);
$("#target4").remove();
$("#target2").appendTo("#right-well");
$("#target5").clone().appendTo("#left-well");
$("#target1").parent().css("background-color", "red");
$("#right-well").children().css("color", "orange");
$("#left-well:nth-child(1)").addClass("animated bounce");
});
</script>
<!-- Only change code above this line. -->
<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target" id="target1">#target1</button>
<button class="btn btn-default target" id="target2">#target2</button>
<button class="btn btn-default target" id="target3">#target3</button>
</div>
</div>
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target" id="target4">#target4</button>
<button class="btn btn-default target" id="target5">#target5</button>
<button class="btn btn-default target" id="target6">#target6</button>
</div>
</div>
</div>
</div>
Issue Analytics
- State:
- Created 7 years ago
- Comments:6 (1 by maintainers)
Top Results From Across the Web
nth-child() - CSS: Cascading Style Sheets - MDN Web Docs
Note that, in the element:nth-child() syntax, the child count includes children of any element type; but it is considered a match only if ......
Read more >How nth-child Works - CSS-Tricks
Using -n values seems a little weird, because if the end result is negative there is no match, so you'll need to add...
Read more >Help understanding what nth-child is and what does it do?
Here's how you would give the third element in each well the bounce class: $(".target:nth-child(3)").addClass(“animated bounce”);
Read more >Create advanced animations with smart animate
You can adjust opacity through a layer's Fill properties, as well as through the Layer property. Smart animate will apply to both.
Read more >Docs • Svelte
It also provides all the other pieces you need to build a web application such ... With this, npm run build will generate...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
how did you get it, I’m confused
Thank you so much…I got it