javascript - mark.js trigger event from selection -
i can't seem figure out how use mark.js (or other tools) allow me trigger animated highlighting when button selected in table of contents.
e.g. imagine on left side of page list of questions. when user selects 1 of these questions/clicks on question, corresponding answer gets highlighted on right side, somehow. right side of page goes dark except corresponding text or red frame animates around corresponding text, or highlighted...any ideas?
in other words, highlighting triggered based off of click or tap, , not search result.
you don't need mark.js it's more easier:
$(function() { $("[data-question]").on("click", function() { var number = $(this).attr("data-question"); $("[data-answer]").removeclass("highlight"); $("[data-answer='" + number + "']").addclass("highlight"); }); }); .questions, .answers { float: left; width: 50%; } .highlight { background: red; } <div class="questions"> <ul> <li data-question="1">question 1</li> <li data-question="2">question 2</li> <li data-question="3">question 3</li> </ul> </div> <div class="answers"> <ul> <li data-answer="1">answer 1</li> <li data-answer="2">answer 2</li> <li data-answer="3">answer 3</li> </ul> </div>
Comments
Post a Comment