CODEWITHSUNDEEP
javascriptjquerycsswordpress
MMPL1
MMPL1

Reputation: 543

Change element css when div has specific class

I have problem with my code. What I want to do is change css of elemnt when I'm on first div. So, when I'm on first div my element have for example font-size: 24px; when I scroll down my element should have font-size: 40; I'm using wordpress and Vase theme. My site - http:///www.ciranga.pl

When I'm on main slide (with red background) I want to make my arrows on right to be white. When I scroll down I want it to be red. How Can I do that? Any help would be great.

jQuery(document).ready(function($) {
if ($('.swiper-slide:first-of-type').hasClass('swiper-slide-active')) {
    $('.vase_whiteC').css('font-size', '40px');
} else {
    $('.vase_whiteC').css('font-size', '24px');
}
$('html').keydown(function(e) {

    var Key = e.keyCode;

    if ([37, 38, 39, 40].indexOf(Key) > -1) {

        // up!
        if (Key == 38) {
            $(".umicon-vase_arrowPrev").parent().trigger("click");
        }

        // down!
        if (Key == 40) {
            $(".umicon-vase_arrowNext").parent().trigger("click");
        }

        return false;
    }

});

});

Upvotes: 2

Views: 216

Answers (2)

Pyromonk
Pyromonk

Reputation: 689

After working with the original poster, we have arrived at this solution:

$(window).on('wheel', function() { setButtonState(); });
arw = $('.sliderBtnWrapper [class*="vs_swiper-button"]').click(function() { setButtonState(); });

function setButtonState() {
    setTimeout(function() {
        var sbw = $('.sliderBtnWrapper').children('.vs_swiper-button-prev-contentSlider.swiper-button-disabled').length;
        if(!sbw) {
            arw.css('color', 'red');
        } else {
            arw.css('color', 'white');
        }
    }, 600);
}

Upvotes: 1

Bhupat Bheda
Bhupat Bheda

Reputation: 1978

You can use other methods like $(document).scroll(function(){

Below code is not your answer but you can try something like that

var

 $w = $(window).scroll(function(){
    if ( $w.scrollTop() > targetOffset ) { 
            // add css here
     }
  }

targetOffset would be 38,40.

Upvotes: 1

Related Questions