I am using prototype to add a "blind" up and down functionality when I click on a table element.
Now, i would like to toggle the [-] in the "altlink" span to match the state. Ie, if a person clicks on the table, the "formhide1" span will collapse, and the [-] should turn into a [+]. Visa versa, when the now collapsed "formhid1" span is expanded the [+] should turn into a [-] Code:
I am new to javascript, and am having an issue, which I'm sure is elementary.. I found a script for expandable content, it suffices fine. As it stands, the script toggles images onclick. For example, whence the menu is collapsed, it displays "plus.gif" next to it, and when the menu is expanded, it displays "minus.gif" next to it.
Basically, what I would like to know is, thus: how would I change it to display text icons next to it? For example, in place of "plus.gif" I should like it to display "+" as actual text. I've dredged a number of places, however, I've found nothing. Furthermore, I cannot figure out how to do it.
I am trying to create a Link that changes its currently displayed text and also toggles the css.display property from inline to hidden. I'm sure there are solution outs there btu I have not been able to find one that does both functions with one click properly and is also easy to implement for people not as familiar with html and javascript. Obviously I am trying to create a show more, show less type link. currently this often shared code works fine to change the current state of the target ID's css.display from none to inline. My end goal is to be able to not only toggle the display of the LONG1 div but to also change the innerhtml of 'short1' from "Show More" to "Show Less".I am still learning about JS so Im really rough around the edges. I tried some different techniques btu I dont ahev them posted on my work pc.
View 14 Replies View RelatedI have two series of radio buttons...(call them Group A and Group B)
and a Textarea.
When you click on any of the radio buttons in the A group, it
automatically adds some text to the textarea, using a javascript
onClick function.
When you click on any of the radio buttons in the B group, it appends
another line of text to the existing text already in the textarea,
again, using a javascript onClick function
What I need is to make the group B onClick act like a toggle, so if
the associated text isn't there, it will add it... but if it IS
there... it will remove it. Code:
Im trying to hide a div ( quick reply box) like IPB using this code it's hidden but the actual link to toggle it isn't a live link for some reason any idea's what im doing wrong would be good.
This is what i am trying to hide
Im not sure how i get this to toggle to show/ re hide the div.
<div id="myClickyDiv" onclick="swapMyToggledDiv();">Toggle</div>
I found this little script and it works fine but the only thing is when the page first loads it displays the "This is foo" text. I would like it to not display the text until it is clicked. So instead of it displaying "This is foo" when the page loads I would like it to not display anything.
Here is the script:
Code:
<body>
<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
//-->
</script>
<a href="#" onclick="toggle_visibility('foo');">Click here to toggle visibility of element #foo</a>
<div id="foo">This is foo</div>
</body>
Complete newb trying to break apart existing code to add some additional function.
This is the working code:
<a class="hackadelic-sliderButton" title="click to collapse panel" onclick="toggleSliderOfGroup('.a-32', '#hackadelic-sliderPanel-1')" href="javascript:;">Close Panel </a>
What I would like to do is add in an html anchor so that the browser relocates to the top of the page just as the panel toggles closed. ie
<a href="#topofpage"></a>
I'm trying to get an A tag to toggle between hide and show when It is clicked, you can check the latest version of my trying here:psdesignzone dot com / jquery / d6tftoggle.htmlI'm trying to change the innerHTML I guess of the A tag to hide or show each time that specific element is clicked (i'll need this to work with other a tags as well)
View 1 Replies View RelatedThis code is not able to toggle independently. What can I do so when I click on one of the "1 Comment" links it opens up independently? It also displays like "1 Comment1Comment" instead of "1 Comment" which I assume will display only once if the other issue can be fixed.
HTML:
<span id="c-100" class="numberCom">1 Comment</span>
<div id="c-100" class="comments">
<p>Comment #1</p>
</div>
[Code]....
im using this to hide and show some text, how do i do to change the text "Show" to hide when i click it and back to "Show" when click it again.
<script type="text/javascript">
$(document).ready(function(){
$('.accordion-content').hide();
//toggle the componenet with class accordion
$('.accordion-toggle').click(function(){
[Code]...
Working with a script I had found/pieced together online. It toggles the display of certain content along with selected text (i.e., "view/hide"). It's working great in all browsers except for IE7 (go figure). The showing and hiding of the content works, just not the switching out of the values for "show/hide".
The code is below:
I have a textual "link" that, when clicked, I want the text to change, and I want a number of checkboxes to be toggled on or off. Here's my code. Currently, I just have the text changing - I don't know how to simultaneously check/uncheck checkboxes.
<head>
<script language="JavaScript" type="text/JavaScript">
<!-- toggle off and on, currently unused -->
function checkAll(checkname, exby)
[code]....
currently I have a page with six links. Now since I want to display the imformation on those six links (when each is clicked) in a #mainDiv (below all the links). if figured the most efficient way of doing so was to have all six "links" in six different div's -- all with display: none... and when a user clicks a link I just have the appropriate div set to display: block. Code:
View 38 Replies View RelatedI have a text field (field1) already displayed on the HTML page. However, there's a link where you can add additional text fields to the page as well. When the link is clicked, the second text field is added successfully (field2), and when the link is clicked again, the third text field (field3) is added successfully. However, the third field does not add itself to the page, and the text for anything greater than a third field also isn't displayed after. This obviously means that my "fields" variable is not working right
<script language="javascript">
fields = 1;
function addMore() {
if (fields = 1) {
document.getElementById('addedMore').innerHTML = "<input type='text' name='field2' size='25' /> <span>Field 2.</span>";
[Code]....
Trying to have plain text that you can click (div of newslink) which toggles the right parameter of other element (div of rightSidebar). Set rightSidebar initially with css: #rightSidebar {right:200%}
Here's what I have for script, but still not working:
<script type="text/javascript">
$j(document).ready(function(){
$j('#newslink').toggle(
function()
[Code]....
I have a bit of javascript that is supposed to change picture and its accompanying text when you hover over a bit of link text in another area of the page. This is working, however, the text is toggling without the picture due to an invisible area next to each link. I am not sure if it's an issue with applying my javascript to another bit of code or what.
Here is the code that I have that flips the text:
<script type="text/javascript">
function tabOver(which)
[code]....
Here's what I'm trying to do: When someone clicks on plain text with div of "hdrlink", then div of "slideshow" will close up using toggle. At the same time also need div of "headerNav" to move up 300px. When the user clicks "hdrlink" again, then "slideshow" reappears and "headerNav" move back down 300px (starting position)Here's the script:
<script type="text/javascript">
$j('#hdrlink').click(function(){
$j('#slideshow').toggle(800),
[code]....
I'm extremely new to jquery and trying to write a toggle function without using the built-in functionality. From what I've read, this should be a fairly straightforward exerciseHowever, I'm running an issue. My code doesn't seem to do anything. Not clear to me why because nothing is erroring out? Here's what I've got:
<html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> // we will add our javascript code here
[code]....
here is my scenario:
I have a link and a div on a webpage. With the link I want to toggle the content (HTML) of the div. On toggle, I want to load the content from a PHP-file and I want it to load on the toggle, not when the webpage originally loaded (to reduce loading time on the webpage itself).
The file that is loaded on toggle doesn't have to be PHP, but it would help a lot.
I have an onclick() event handler wherein I want to change a value that then
needs to be shown in a textbox on a form on the page......can anyone show me
how this is done?
I have the following code:Code:<input type="text" name="email" value="Enter your email" nclick="document.contact.email.value =''" id="email"/>This works good, however I only want to make the value blank if it equals Enter your email, if it says anything else I don't want it to do that.
View 4 Replies View RelatedI try to create the following:
2 buttons next to each other, on a webpage
button 1 makes (onClick) text 1 appear just beneath the button
button 2 makes (onClick) text 2 appear just beneath the button
in each of the texts at the end there's a third button to make the text
dissappear again
IS THIS POSSIBLE? HOW?
I would like to have a text link do 2 things:
1. Change #box1.style1 to class="style2" (from style1)
2. Change #box2.style2 to class="style1" (from style2)
So the text link would not change its own style, but change the class of 2 different divs
I use scriptaculous to retrieve the hotel names and area names from database in this page. My question is where it says step 3, Search for hotel, chain or location!. Type in syd for example and you see how it retrieves the values from database and shows them underneath. It works fine and the list is generated beautifully. Now I have to add the next step which is filling this text box (from step 3 where you typed syd in) with the value (of the item clicked on). For example once you typed sydney, if you click on Sydney, I want the text field to be filled with value sydney.
View 4 Replies View RelatedI've created two form fields (username, password).When a user comes to the page, the word "Username" is shown in the first form field. The word "Password" is shown in the second field. When a user clicks inside the field, the word inside the field erases automatically, allowing them to type in their username. Everything above is working, except I'm running into some problems.
1st: I need to figure out a way to include an if statement, that displays "Username" once again, if they did not type anything in the username field, and they clicked outside of the field. This will be the case for the Password field as well.
2nd: If a user types in their username in the username field, then types in their password, but clicks on the Username field once again to fix a typo, it completely erases their username from the field, making them have to type it all again.
My site inventive.webs.com/ad-hoc contains lists of activities. When a user double clicks on an activity, the text will change to textbox, then double click again on the textbox to return to static text, which is so far working properly. What I want to happen next are:
1. Textbox must return back to static text when user clicks anywhere on the body.
2. When there's an existing textbox, it should return to static text when another activity list is being double clicked.
[Code]....