塗改psudo類與jQuery的

我有一個CSS說塗改psudo類與jQuery的

div.borderYtoX a:before, 
div.borderYtoX a:after { 
    position: absolute; 
    opacity: 0.5; 
    height: 100%; 
    width: 2px; 
    content: ''; 
    background: #FFF; 
    transition: all 0.3s; 
}

在這裏我要改變背景，以一些不同的顏色，當我向下滾動。它影響滾動的導航菜單。下面是jQuery代碼，也是我嘗試過的，但不起作用。有沒有可能的方法來做到這一點？

$(document).ready(function(){ 
    var scroll_start = 0; 
    var startchange = $('#startchange'); 
    var offset = startchange.offset(); 
    $(document).scroll(function() { 
     scroll_start = $(this).scrollTop(); 
     if(scroll_start > offset.top) { 
      $('.header').css('background-color', 'rgb(255,255,255)'); 
      $('div.container a').css('color', '#063193'); 
      $('.borderYtoX a:before, .borderYtoX a:after').css('background', '#063193'); 
     } else { 
      $('.header').css('background-color', 'rgba(255,255,255,0.3)'); 
      $('div.container a').css('color', '#fff'); 
      $('div.borderYtoX a:before, div.borderYtoX a:after').css('background', '#fff'); 
     } 
    }); 
});

來源

2017-02-17 Shubham Jha

創建一個代碼片段，它將有助於理解問題並給出完美的解決方案 –

不，您不能定位'pseudo'。你不能操作'：after'或'：before'，因爲它在技術上不是'DOM'的一部分，因此不能被任何'JavaScript'或'jQuery'訪問。但是你可以用一個新的'：after'或'：before'指定一個新類。請參閱此[** SOAnswer **]（http://stackoverflow.com/a/17789110/4763084） – vivekkupadhyay

[訪問css的可能的重複：後選擇器與jQuery]（http://stackoverflow.com/questions/17788990 /接入最CSS-後選擇與 - jquery的） – vivekkupadhyay

您不能使用JavaScript訪問僞元素，因爲它們實際上不存在於DOM中。如果你想操縱他們使用jQuery的覆蓋類適用於元素，並添加一個CSS覆蓋爲新類

CSS

div.borderYtoX a.active:before, 
div.borderYtoX a.active:after { 

    background: #063193; 
}

腳本

$(document).ready(function(){ 
    var scroll_start = 0; 
    var startchange = $('#startchange'); 
    var offset = startchange.offset(); 
    $(document).scroll(function() { 
     scroll_start = $(this).scrollTop(); 
     if(scroll_start > offset.top) { 
      $('.header').css('background-color', 'rgb(255,255,255)'); 
      $('div.container a').css('color', '#063193'); 
      $('.borderYtoX a, .borderYtoX a').toggleClass('active'); 
     } else { 
      $('.header').css('background-color', 'rgba(255,255,255,0.3)'); 
      $('div.container a').css('color', '#fff'); 
      $('div.borderYtoX a:before, div.borderYtoX a:after').css('background', '#fff'); 
     } 
    }); 
});

來源

2017-02-17 11:27:02 NeilWkz

塗改psudo類與jQuery的

回答

相關問題