javascript - Swiper JQuery if statement involving .hasClass and .toggleClass -
without writing novel of backstory, using swiper, i'm trying call .toggleclass
on html element, whenever 1 of swiper slides has class of swiper-slide-active
. can have text appear on single slides, instead of slides @ same time.
here visual of i'm describing: studioyonis.com — if click caption @ bottom project information comes up, drag rtl, you'll notice project information second project visible short time. disappears (correctly) because of other code have, l not appear @ (until click caption on slide).
i've been trying if statement single out active slide , set subsequent click function, not working , can't figure out life of me. can jquery, reason, not see swiper-slide-active
when happens?
if ($('.swiper-slide').hasclass('swiper-slide-active')) { $('.overlay-caption', this).toggleclass('overlay-caption-active'); $('.overlay-caption-box', this).toggleclass('overlay-caption-box-active'); };
here sample of html structure. there ~7 different slides this, overlay-caption
, overlay-caption-box
classes.
<div class=“swiper-slide”> <div class=“caption-box information-00”> <a class=“caption links”> text text text text text text </a> <div class=“overlay-caption-box”> </div> </div> <div class=“overlay-caption”> <div class=“project-information”> text text text text text text text text text text text text </div> </div> </div>
hopefully makes sense! been long 10-12 hours of work on site today, realize problem near end of night.
cheers!
instead of changing display
, locked swiping different slides while project information visible. way user doesn't know of captions open because s/he can't scroll them. forces user slow down , @ each project, instead of swiping through. since portfolio site, maybe thats thing in case.
Comments
Post a Comment