toggle

jquery点击toggle并改变图片src源码

邮差的信 提交于 2019-12-06 03:59:09
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery点击toggle并改变图标src</title> </head> <script src="images/jquery-1.8.3.min.js"></script> <script> //函数实现 //参数para1:希望隐藏元素的id //参数para2:希望改变图片src的img的id /* function toggle1(para1,para2){ if($("#"+para2).attr("src")=="images/col_24.jpg") { $("#"+para2).attr("src","images/col_11.jpg"); } else { $("#"+para2).attr("src","images/col_24.jpg"); } $("#"

How to show/hide hidden HTML table rows using JavaScript (no jQuery)

谁说胖子不能爱 提交于 2019-12-06 00:05:16
Edit: This has been answered below. I would like to have an HTML table that has hidden rows between each row with more information about the top level rows. When clicking an expand/collapse image link in the first column, the hidden row's visibility will toggle from display:none; to display:table-row;. I have not written JavaScript in a while and need to be able to do this strictly in JavaScript and cannot use the jQuery toggle() method. How can I use JavaScript to find the sibling with class="subRow" of the with class="parentRow" that the button is located in within the table and then toggle

How to make it smoother with toggle ('slow')

折月煮酒 提交于 2019-12-05 23:36:52
I have the following code which works but it becomes a bit jumpy at the end of each toggle action. Will it be smoother if I toggle the paragraph? I am trying to get the paragraph, but I don't know how to do it. Can anyone help me please? Thanks in advance. <head> <style type="text/css"> body {width: 660px; margin: 0 auto; } .toppara{ background-color: #FF9; } .morepara { background-color: #fff; display:none; } .togglebutn { color: #900; background-color: #FFF; } </style> </head> <body> <div id="section1"> <div class="toppara"><p>Content 1.</p> </div> <div class="morepara"> <p> Content 2. </p>

Get Element By Classname Script Not Working

限于喜欢 提交于 2019-12-05 22:35:44
I know, it's not supported by IE, but I found a cool script online that someone was generous enough to provide for free, but I can't figure out why it's not working. I've been staring at this for hours, please point me in the right direction! My code: <script language="javascript" type="text/javascript" src="getbyclass.js"></script> <script type="text/javascript" language="javascript"> function editToggle(toggle){ if (toggle == "off"){ getElementsByClassName("editp").style.display ="none"; document.getElementById('editToggle').innerHTML="<a href=\"#\" onclick=\"editToggle(\"off\"); return

Why did jQuery remove .toggle() method? [closed]

匆匆过客 提交于 2019-12-05 21:42:48
.toggle( handler, handler [, handler ] ) I believe this API is very handy. But why jQuery 1.9 removed it? It was deprecated in 1.8, as per ticket # 11786 . It was later removed in 1.9. Basically, that ticket contains the real reasons, such as: The .toggle() method is provided for convenience. It is relatively straightforward to implement the same behavior by hand, and this can be necessary if the assumptions built into .toggle() prove limiting. For example, .toggle() is not guaranteed to work correctly if applied twice to the same element. Since .toggle() internally uses a click handler to do

How to determine the current state of jQuery toggle()

房东的猫 提交于 2019-12-05 17:39:57
I'm showing and hiding divs when another div is clicked on. I need to be able to determine if a particular div is either shown or hidden. Ultimately what I'm trying to do is, when a certain div is clicked on, all other "show/hide" divs should be hidden and then determine if the clicked-div's related div is showing, if so hide it, otherwise show it. I also need to add/remove a css class (for background color) to the shown/hidden div based on its toggle state. Here's the jQuery code I'm using to toggle the show/hide state of the divs: $('#movieListTable').on('click', 'div.vitalsTable', function

toggle edit buttons with save and cancel buttons

我们两清 提交于 2019-12-05 16:18:34
I want to change the button when it's clicked. Initial there's only one "Edit" button. After I click it, it will become a "Save" button and I also want to show a "Cancel" button next to it. How can I do that? I have the code below. <!DOCTYPE html> <html> <head> <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <meta charset=utf-8 /> <title>demo by roXon</title> <!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <button data-text="Save">Edit</button> <p>Hello</p> <p style="display:

jQuery toggle div from select option

眉间皱痕 提交于 2019-12-05 13:09:53
I'm in need to toggle divs from a dropdown select option box. I'd like it similar to asmselect for jquery but instead of listing the option tag I'd like it to display a hidden div. Is there anything like this out there? Or anyone know how to set it up? Thanks, Jeff. UPDATED Basically what I want is the look and interaction of the asmselect link above though toggling divs instead of generating a list. Example code below: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>

Toggling a CSS3 animation on click

送分小仙女□ 提交于 2019-12-05 10:08:06
What is the best way to alternate the direction of a CSS3 animation on click without javascript? I've been exploring checkbox hacks lately and trying to figure out a way to have only one set of keyframes instead of two sets for one going forward and one to come back. Is this possible? Or is there a way to do it with one set? For instance I have the following keyframes: @keyframes moveIt { 0% { transform: translateX(0); width: $size; } 50% { width: $size*1.2; } 100% { transform: translateX(50px); width: $size; } } @keyframes moveItBack { 100% { transform: translateX(0); width: $size; } 50% {

Toggle dynamically created divs

人盡茶涼 提交于 2019-12-05 09:06:19
I'm writing my own lightweight blogging platform (I'm trying to learn PHP & jQuery so I don't just want to use Wordpress). Using PHP, I have a pagination system that shows 5 blog posts per page. Within my while loop, I want to have a link that says "Leave a Comment" which, when clicked, will open up a DIV that has a textbox to input a comment. The current code i'm using opens up ALL 5 comment DIVs on the page. I need to be able to give each of those commment DIV's a unique ID (based on the blog post's ID I assume) and put that in my jquery toggle function so that only one comment DIV is opened