Questions tagged [toggleclass]

The toggleClass method in jQuery provides a mechanism for adding or removing a class or list of classes by name from selected elements.

The toggleClass method in jQuery provides a mechanism for adding or removing a class or list of classes by name from selected elements.

For example, if a CSS class has been applied to a div and the user wishes to remove this class from the div, the following code would accomplish this task:

theDiv.toggleClass('theClassName');

Documentation for the toggleClass method can be found in .toggleClass().

503 questions
2
votes
2 answers

jQuery toggle Class on multiple Elements with interval

I've created this little fancy jQuery Snippet to toggle the class of an element in an interval: setInterval(function(){$('.grid-item .slide-image').toggleClass('active')}, 800); The script works fine! Now I got multiple elements with the base-class…
Jonas
  • 163
  • 1
  • 3
  • 10
2
votes
1 answer

transform:scale to fullscreen?

Good day all, A series of differently sized images are each individually wrapped in left floating differently sized divs on a horizontally scrolling web page. I want to be able to tap on a div to scale it to fullscreen, (by adding a css class…
Bussard
  • 33
  • 1
  • 3
2
votes
2 answers

Toggle between 2 classes in jQuery

How can I toggle between two classes in jQuery, while the element does not have either class. Please note: I want to know if there is a way to do this with the toggleClass() method and not by addClass(), removeClass(). For…
user6885321
2
votes
3 answers

Toggle class in closest parent

So I have this jquery that i need to make it work. But through all the parents() and children(), I can't get to where I want. My objective is when I click in the button, the class icon-cross, toggle to icon-tick. (In this snippet bellow, I made an…
grcoder
  • 324
  • 5
  • 17
2
votes
1 answer

Using data-attr to identify an active selection

I'll try to keep it at simple as I can. I have a JSON object that is pulled via AJAX. I am displaying a list of icons in a main div from the data dynamically which can be toggled on or off. I have a secondary div where the selected items are…
Nicholas Hazel
  • 3,758
  • 1
  • 22
  • 34
2
votes
3 answers

jQuery: When parent element is clicked, hide child element. When child element is clicked, don't hide it

I have a parent element with a child element that is displayed/hidden by clicking a specific button on the page. The button just changes the style from display:none to display:block, pretty simple. The child element starts off as display:none; I…
FranticJ3
  • 107
  • 1
  • 12
2
votes
3 answers

Use Javascript to change body CSS upon clicking a label

I am working on a website for a friend. I use an off-screen CSS menu. The button that invokes the menu is not an HTML button, its listed as a Input and Label. When using the menu you can still scroll on the main body of the pag. I would like to…
2
votes
2 answers

Toggle disable/enable checkbox by replacing class name

I have a set of 5 checkboxes with class set to "child". I want that if I select one checkbox, rest of them goes disabled. I have tried following code but it disables the all checkboxes. if ( !$(this).is ( ":checked" ) ) { …
Jabran Rafique
  • 335
  • 1
  • 4
  • 18
2
votes
2 answers

Why is this simple jQuery toggle not working?

I am wondering why this toggle is not working. The addClass method and therefore hiding the nav is working well... Is there a simple typo I am missing or am i getting the concept wrong? Thanks for support. $(document).ready(function() { …
user5716144
2
votes
5 answers

Show different divs and add class if div is shown

I want to show a div depending on which link is clicked. If btn1 is clicked, link1 should get the class="activemenu" and div1 should be shown. If btn1 is clicked again, the class should be removed and the div be hidden. If btn2 is clicked the same…
sebi
  • 47
  • 11
2
votes
2 answers

jQuery toggleClass speed not sliding back the same when toggling back

I have the following jquery code to get a div to slide from left to right, but upon clicking again, it instantly goes back to original position (left) without the slide animation. Not sure what I'm doing wrong here. $('#box').click(function(){ …
Jnsn_
  • 155
  • 1
  • 1
  • 14
2
votes
1 answer

Bootstrap 3 - Toggle - 2 buttons, 2 elements - How to show/hide?

I'm building a layout template for devs to integrate into their AngularJS/Bootstrap application using Bootstrap 3.3.6. This layout features a left side nav contextual menu which slides over the top of the main page content when opened, or optionally…
2
votes
1 answer

toggleClass when reaching bottom of page

There is the code I use in order to change the css of my sticky header when a user start scrolling. I would like to keep it like that but I'm looking to change my sticky header back to its original css class (#header_container) when the user…
imromains
  • 99
  • 9
2
votes
2 answers

primefaces toggle (command)button

I'm trying to use a primefaces commandbutton as toggle button. My idea was to add a css class with the desired style, in this way: javascript: function toggleButton() { …
Neo
  • 1,337
  • 4
  • 21
  • 50
2
votes
0 answers

toggleClass and slideToggle bug

The main question I have concerns toggleClass(). Since I'm not the greatest with jQuery, I'm not sure what to search for. Here is my code: JS jQuery.noConflict(); jQuery(document).ready(function() { jQuery('.quickLinks').click(function() { …
homsAU
  • 51
  • 1
  • 5