Hey, does anyone know of a plugin that, if a child element has focus, a parent element you specify can get focus? E.g. in this case, if the footer anchor is focused, I want the <section> to be able to get a class or something.
<section>
<header>
<h2>Title Here</h2>
</header>
<div class="content">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh.</p>
</div>
<footer>
<a href="#thing">Go To Page</a>
</footer>
</section>
Although querying for the closest section all the time is rather expensive; it would be better to cache that element. You might then wrap this in a small extension like
Thanks! I put a 2nd anchor on the page and also an input, and changed the selector on the jquery call…why is the first element screwed up as you tab through it?
c odere po.de mo.fina lsite.com/keyb oard-in ner-an chor-ele ment
My page currently has your second version of the plugin, not the first, but still screwy.
$('a, input').parentFocus('section', function () {
$(this).toggleClass('active');
});
Hm… my first guess was that immediately removing and re-adding that class would break some animation, but if all you have is a CSS top transition that can’t be the problem. With just that, I can’t reproduce the problem – see this pen.
There must be something else in play here… can you break down the bug in a smaller pen where the relevant JS and CSS is all in one place?
Nice idea to handle the keyboard navigation BTW. :-)
That pen still shows the issue…working on narrowing down the code…No matter what, I can’t get yours to show the bug, so it must just be something with the way I’m working this…
No worries, glad I could help! Not sure what you mean with calling external functions though… if the functions are available in the outer scope, you can call them inside the callbacks as usual – or just pass them in as callbacks themselves.