jQuery .css() method

Question

// Add CSS properties into .AddCssIntoThisClass
$(".AddCssIntoThisClass").css({"height": "64px", "overflow": "hidden"});

$('html, body').css({ overflow: 'hidden',height: '100%'});

Answer 1

/*important - to overwrite important CSS*/
$( '.myclass' ).each(function () {
  this.style.setProperty( 'height', '0px', 'important' );
});

Answer 2

//Add CSS attr to elements
$(document).ready(function() {
  $('#div1, #div2').attr('class','NewCSSClass');
});

Answer 3

//Close div with css method, e.g toggle menu
$('.business-details__toggle').click(function() {
  $('.sidr.left').css('left', '0rem');
});
    
  $('.sidr__toggle').click(function() {
  $('.sidr.left').css('left', '-44rem');
}); 

Answer 4

//Add style attributes to specific element
$("#page-content").find(".details").css( { marginLeft : "30px", marginRight : "30px" } );

//or
$("#page-content").find(".details").css( 'min-height', '128px');

Answer 5

//To change only style attributes
$('.handle').attr('style','left: 300px');

Answer 6

//To add style properties
$('.handle').css('left', '300px');

Answer 7

$('#scroll-header').css({"height": "52px", "position": "fixed", "top": "0", "z-index": "2002", "width": "100%"});

 

Answer 8

if ($('.skin-ads').length) {
  $('.new-theme').css({'top': '300px', 'margin-bottom': '300px', 'transition': 'all .5s .2s ease-in-out'});
} 

 

Answer 9

$('#block-block-5, #block-block-10, #block-block-11').css('border-top', '#fff solid 25px');