peace_love
peace_love

Reputation: 6471

How can I remove a property from a class via jquery?

I try to remove the right and left property with jquery from "navbar-fixed-top" class":

$(document).ready(function () {


  var menu = $('.tab-content');
   var origOffsetY = menu.offset().top;

   function scroll() {
       if ($(window).scrollTop() >= origOffsetY) {
           $('.tab-content').addClass('navbar-fixed-top');
       } else {
           $('.tab-content').removeClass('navbar-fixed-top');
       }
        $('.navbar-fixed-top').removeAttr('right');
        $('.navbar-fixed-top').removeAttr('left');


   }

But still after scrolling the inspector shows the css like this:

.navbar-fixed-bottom, .navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
}

But I need it to be like this:

   .navbar-fixed-bottom, .navbar-fixed-top {
        position: fixed;
        z-index: 1030;
    }

The problem is, that this code comes from an external bootstrap css. So I am not able to just change the file.

Upvotes: 0

Views: 74

Answers (3)

Razvan Cristea
Razvan Cristea

Reputation: 1

The accepted answer will work for Chrome and Firefox, for example, but it might give you some issues in IE, because it won't recognise "initial" as a CSS value.

$(".navbar-fixed-top").css({ 'left' : 'initial', 'right' : 'initial' });

If you need to make this work in IE also, you could try to optimise your CSS, so you have a separate class for adding and removing the left and right, or try the 'auto' value, which IE will recognise, but that depends on what your design is.

Upvotes: 0

Warden330
Warden330

Reputation: 1042

edit: i was wrong about Jquery not being able to access Classes in Stylesheets. You just have to change the value.

$(".navbar-fixed-top").css({ 'left' : 'initial', 'right' : 'initial' });

should do the trick to change the classes attribute.

if you use empty ' ' it will not work for classes.

Upvotes: 2

Desope
Desope

Reputation: 64

try this

$(".navbar-fixed-top").css({ 'left' : '', 'right' : '' });

you just need to empty the value of the property

Upvotes: 1

Related Questions