toggleclass

Problems when toggling a class called “a:active” using jQuery

无人久伴 提交于 2019-12-02 08:46:37
As it stands, clicking on "Link" twice redirects you to a page, but whenever you click on and around it such that the menu drops down or goes up, the CSS code a:active span { color:#bdbcae; } is put into effect. What I am trying to do is make it so that the link only changes color when you click it the second time, resulting in you being redirected to the page. If you click it only once so that only the menu drops down, I want the link to remain its default color. This is the code in my function below that I was looking at to accomplish this if ($(this).data('clicks')==2){ $(this).data('clicks

localStorage, saving a class using toggleClass

假装没事ソ 提交于 2019-12-01 13:04:40
问题 I am clueless when it comes to localStorage it seems. I want to set up a way favorite any div in a group of div's by toggling a class. I can get the toggleClass to work on the individual div and be saved but localStorage saves all the div's as favorites, not just the one with the toggleClass set. Obviously I am missing something. jsfiddle simple example localStorage code: if (typeof (localStorage) == 'undefined') { document.getElementById("result").innerHTML = 'Your browser does not support

Three-way toggling of two states (Javascript or jQuery)

不羁岁月 提交于 2019-12-01 11:47:43
I am working on a page that will show prices in a choice of currencies (euros, pounds or dollars). My aim is to display the price in euros first, keeping the pound and dollar prices hidden. <button id="mybutton">Change Currency</button> <p id="euro" class="shown">Euro</p> <p id="pound" class="hidden">Pound</p> <p id="dollar" class="hidden">Dollar</p> When the button is clicked, I need the three ids to cycle through the three states shown/hidden/hidden, hidden/shown/hidden and hidden/hidden/shown. So far I have made it work with two ids (not difficult!). $('#mybutton').click(function() { $('

Toggle between 3 classes using toggleclass

倖福魔咒の 提交于 2019-11-29 07:57:30
I have 3 images that I want to switch between. I put each one of them in a class & change it's image in the css. I can now switch between 2 classes but when I add the third one the code doesn't work. Any class of them can be the starting one. $('.one').click(function(){ $(this).toggleClass("two"); $(this).toggleClass("one"); }); $('.two').click(function(){ $(this).toggleClass("one"); $(this).toggleClass("two"); }); When I add this line: $(this).toggleClass("three"); It doesn't toggle at all.... Do you know a method in which I can put all of them in one function ? Thanks. Example fiddle: http:/

jQuery的属性与样式之切换样式.toggleClass()

假装没事ソ 提交于 2019-11-29 06:01:10
在做某些效果的时候,可能会针对同一节点的某一个样式不断的切换,也就是addClass与removeClass的互斥切换,比如隔行换色效果 jQuery提供一个toggleClass方法用于简化这种互斥的逻辑,通过toggleClass方法动态添加删除Class,一次执行相当于addClass,再次执行相当于removeClass .toggleClass( )方法:在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即:如果存在(不存在)就删除(添加)一个类 .toggleClass( className ):在匹配的元素集合中的每个元素上用来切换的一个或多个(用空格隔开)样式类名 .toggleClass( className, switch ):一个布尔值,用于判断样式是否应该被添加或移除 .toggleClass( [switch ] ):一个用来判断样式类添加还是移除的 布尔值 .toggleClass( function(index, class, switch) [, switch ] ):用来返回在匹配的元素集合中的每个元素上用来切换的样式类名的一个函数。接收元素的索引位置和元素旧的样式类作为参数 注意事项: toggleClass是一个互斥的逻辑,也就是通过判断对应的元素上是否存在指定的Class名,如果有就删除

jQuery属性与样式

*爱你&永不变心* 提交于 2019-11-29 06:00:22
attr()方法 、jQuery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写,在jQuery DOM操作中会经常用到attr() attr()有4个表达式 attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属性的值 attr(属性名,函数值):设置属性的函数值 attr(attributes):给指定元素设置多个属性值,即:{属性名一: “属性值一” , 属性名二: “属性值二” , … … } removeAttr()删除方法 .removeAttr( attributeName ) : 为匹配的元素集合中的每个元素中移除一个属性(attribute) 优点: attr、removeAttr都是jQuery为了属性操作封装的,直接在一个 jQuery 对象上调用该方法,很容易对属性进行操作,也不需要去特意的理解浏览器的属性名不同的问题 . html()方法 获取集合中第一个匹配元素的HTML内容 或 设置每一个匹配元素的html内容,具体有3种用法: .html() 不传入值,就是获取集合中第一个匹配元素的HTML内容 .html( htmlString ) 设置每一个匹配元素的html内容 .html( function(index, oldhtml) ) 用来返回设置HTML内容的一个函数 注意事项: .html(

jQuery: Remove class if other element is clicked

喜夏-厌秋 提交于 2019-11-28 18:02:10
问题 I have an ul-list that contains li-elements. When the user clicks on one of these li elements a class should be added to that element. This is easy to setup, however, when the other li-element is clicked I want the "active"-class to be removed from the non-active li. I have made a jsfiddle of the problem: http://jsfiddle.net/tGW3D/ There should be one li-element that is red at any one time. If you click the second and then the first, only the first should be red. 回答1: This will remove the

Keeping toggled class after page refresh

我的梦境 提交于 2019-11-28 11:51:35
am thinking this has been done many times before but despite reading some posts about cookies couldn't get my head round it. I basically have a second body class with different fonts for the whole site which is accessed when the clients clicks a link to change font. Ideally this wouldn't be on a page-by-page basis but the new class would 'stick' after a new page is visited. My change class code via jquery looks like this: $(document).ready(function() { $("a#switcher").click(function() { $("body").toggleClass("alternate_body"); }); }); Is there a relatively simple way of achieving this? Thanks

How to toggle between two divs

倖福魔咒の 提交于 2019-11-28 10:28:01
I am trying to toggle between two divs. For example, onload, I want the left content to show and the right content will remain hidden. If I click the right div, I want the left content to hide and the right content to appear and vise versa. I am very new to javascript but here is what I have. I can't seem to get it to work. Please help... Here is my HTML code: <div onclick="toggle_visibility('left');"> Left </div> <div onclick="toggle_visibility('right');"> Right </div> <div id="left" style="display: block;"> This is the content for the left side <div> <div id="right" style="display: none;">

Toggle between 3 classes using toggleclass

▼魔方 西西 提交于 2019-11-28 01:26:45
问题 I have 3 images that I want to switch between. I put each one of them in a class & change it's image in the css. I can now switch between 2 classes but when I add the third one the code doesn't work. Any class of them can be the starting one. $('.one').click(function(){ $(this).toggleClass("two"); $(this).toggleClass("one"); }); $('.two').click(function(){ $(this).toggleClass("one"); $(this).toggleClass("two"); }); When I add this line: $(this).toggleClass("three"); It doesn't toggle at all..