Hide Link And Div OnClick?
Mar 24, 2010
I am having trouble trying to hide a link and a div when I click on a link. Here is what I tried to do first.
I have two links and one div box. When I click the first link I want to show the div box and another link (hide) then at the same time I want to hide the link that I clicked.
Showdiv HideDiv(initially hidden)
--------------div box------
| initially hidden |
| |
[Code]....
If it is not possible to do with link (<a> tags) can I achieve this with an image? Lets say I just change the image onclick and show a div box and then click the same (now changed image) and hide the box.
View 5 Replies
ADVERTISEMENT
Apr 20, 2010
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 Related
Aug 25, 2010
Im updating a website to use ajax instead of Iframes. Ajax is working fine to load html content into a <div> yet my issue lies with the navigation buttons that trigger my ajax requests.
I have css styled buttons that contain <a> links </a>, i have removed the href and used a onclick event instead but when i remove the href the mouse will lose its hand cursor on hover and the css styled buttons stop working correctly.
Code:
<script type="text/javascript">
function loadXMLDoc()
{
if (window.XMLHttpRequest)
[Code]....
View 6 Replies
View Related
Aug 10, 2009
Alright, me having a very basic knowledge of js I'm looking for some help with(what I think should be) a simple hide/show of a set of divs. I've broken down the ccs/html I'm looking at on a test page here...
The js I have in the page had been what I tried to modify from a simple hide/show, but it's not doing what I want it to do (obviously). The goal is when you click on link 3, I want white3 to hide and all the other white divs to show, when you click on link 3, white 2 will hide and the other white divs will show, and so on. So basically it's revealing what div you click to. A lot of what I've found have been just toggles, but I'm not very confident in my ability to adjust code.
View 7 Replies
View Related
Jan 30, 2010
I'm new to the forums, so if i post anything wrong let me know. I'm trying to use links to hide all the images, and show just ones from a certain category. I've used the img name attribute to group them and tried to do a function that shows only one img.
<script language="javascript">
function showone(x) {
document.getElementByName('a').style.display='none';
document.getElementByName('b').style.display='none';
document.getElementByName('c').style.display='none';
[Code]...
except the links don't work like they should, and I can't figure out why. I'm an idiot with javascript, so if feel free to make fun of me, and if anyone knows how to get this simple function to work,
View 9 Replies
View Related
Nov 12, 2010
i have php code that shows a list of colored boxes and when you click one it changes the color of a div... this works fine as i have used a changecss function... i have these colors in a database with their values and specific color names... what i am trying to do is when a color is clicked it will change the div and also print the color name....i have made a php loop to print all the color names and i have the display as none... how can i add to the onclick function that changes the color to also put the display of the certain color name to "block" and then if you select another color it hides that one and shows the new color.
View 8 Replies
View Related
Mar 3, 2009
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>
View 3 Replies
View Related
Nov 20, 2002
Is it possible to set the browser default to hidestatus for all onclick events?
View 3 Replies
View Related
Jul 23, 2005
Problem: I want to send an URL via button but i don't want to get the result.
At the moment i use this form to send the URL, which enables a control unit:
<form><input type=button value="switch on"
As result i see a new page with "0" or "1", which i'd like to hide.
What can i do to send the URL without getting the result to the browser ?
View 5 Replies
View Related
Jul 28, 2009
where i need to hide my span id through onclick command but its not working.....my program is below...
<label for="txtFullname">First Name:</label>
<a id="myHeade2" href="javascript:showonlyone('newboxes2');" >
<input id="txtFullname" name="txtFullname" type="text" style="font-size:16pt;"
onblur="validate(this.value, this.id)"
value="<?php echo $_SESSION['values']['txtFullname'] ?>" /></a></td><td width="262"><div name="newboxes"
[Code]...
View 1 Replies
View Related
May 27, 2010
I want a background image of a tick to appear in each coloured box in my attached image onclick. When another coloured box is clicked I want the image to show in that one and then hidden in the previous one clicked. There should be no ticks shown on page load.I'm clueless as to how to do this.Here's my code for the image attached:
<div class="colour-picker">
<div class="tick-off" id="red" onclick="changeclass();">
</div>
[code]....
View 1 Replies
View Related
Apr 30, 2009
I am looking for a script that on click of a button Hides the parent window and open a new window/layer.
To get better understanding please click on following link [URL] and than click Furniture Image...
View 2 Replies
View Related
Feb 8, 2011
I have a page where an alternate address area is kept hidden via JavaScript and CSS divs. If you click that you want to use an alternate billing address, two divs are expanded. One with the form fields for entering in your alternate address, the other area has further info about why we need that alternate address. (Code is below). This works PERFECTLY for my needs....however, if you reload the page, the "show" button remains selected and OFF=ON and ON=OFF if you get my meaning...so when you click the radio that should be hiding the divs, it shows them and vice versa. Additionally if there is an error in the form and the page reloads to display the error, only the billing address area stays expanded (its inside the <form> tags), the text area next to it goes back to being hidden, and the show/hide OnClick no longer works. Ideally, I'd like the two to maintain the same state (i.e. if both we're shown, both stay shown).
CODE (trimmed down of course):
Code:
<head>
<style type="text/css" media="all">
.invis { visibility: hidden; display: none; }
.vis { visibility: visible; display: inline; }
</style>
<script language="javascript" type="text/javascript">
var c = 'invis';
var ids = new Array('id1', 'id2'); // IDs of your <div>s
function doSwap() {
c == 'vis' ? c = 'invis' : c = 'vis';
for (var i=0; i<ids.length; i++) {
document.getElementById(ids[i]).className = c;
}}
</script>
</head>
<body>
<div id="id1" class="invis">This is all just plain text that appears when the NO radio is clicked but disappears on reload</div>
<form>
<table>
<tr>
<td>
<input type="Radio" name=" " value="hide" onClick="doSwap()" id=""> YES
<input type="Radio" name=" " value="show" onClick="doSwap()" id=""> NO
</td>
</tr>
<tr id="id2" class="invis">
<td>extra address entry stuff that appears when the NO radio and that stays on page after reload</td>
</tr>
</table>
</body>
View 2 Replies
View Related
Aug 12, 2011
I have a php page that essentially builds a pay report in the form of a table. The php side builds the page properly, though it took some time to get the table rows onmouseover and onmouseout functions to work for row highlighting. Now the issue is the table row's onclick function.
Here is what the outputed html looks like.
<head><script type="text/javascript" language="javascript">
function HideShowDiv(divID){
if (document.getElementById(divID).style.display == "none"){
document.getElementById(divID).style.display = "block");
document.writeln("show "+divID);
}else{
document.getElementById(divID).style.display = "none";
document.writeln("hide "+divID);
}} .....
<tr>
<td colspan="2" align="right">Some Association of Baseball</td>
<td align="right">$24</td>
<td align="center"></td>
</tr>
</table>
</div> <!-- Closes the main body div container -->
In my javascript function, the writeln() calls are for testing to see if the even is even firing. but nothing gets written to the page. Basically I want the row with the users name to be clickable which will show the details in the hidden div associated with the user.
View 5 Replies
View Related
Oct 4, 2011
I have this JS.
function funcBut(){
document.getElementById('ref_button').innerHTML = 'pressed';
}
[code]....
View 1 Replies
View Related
Sep 20, 2010
Im having this problem with multiple onclick on one link. I have a link on my web page that i need to track with two Stats programs, and i need this link to be openned in a new tab. So i need these 3 events (open i new tab and both trackers) to trigger each time a visitor clicks on that link. The 3 onclick i need to use are these:
[Code]...
View 5 Replies
View Related
Jan 22, 2010
look at following html:
<div style="padding-bottom: 4px;">
<img height="10" align="absmiddle" width="10" src="images/1rightarrow.gif"> <a class="mainmenu" href="affiliate-settings.php">Inoutscripts Affiliate Id </a>
</div>
way to hide this div or link in javascript/jquery? I can't make use of class as well because there are several links as well with the same class name.
View 7 Replies
View Related
Oct 30, 2009
I have created a user form in which visitors can fill in sections, some of which are hidden or displayed using the onclick to trigger a DIV to display or hide then submit the results to a database using ASP. All works fine with that, however... I have created another page which retrieves the results for an individual's form submission, and I want to hide the sections that were not completed (hidden when submitted). How can I get my page to hide or show DIVs, depending on the value retrieved from a particular field within the database? i.e. if Question1Response="A", show Div ID="A Section" If Question1Response="B", show Div ID="B Section" etc.
View 4 Replies
View Related
Feb 4, 2011
I have an HTML page that displays content, but I'd like to transfer them to a JS file when they click a button. In other words I'd like the equivalent of doing this:
Code:
<a href="myscript.js">Click here for Help</a>
Obviously this doesn't work.I tried the following, which attempts to transfer, but the screen just goes dark:
Code:
<input type="button" onClick="location.href='../contactus.js'" value='click here' />
This does the same thing.
View 2 Replies
View Related
Apr 28, 2009
If I just have the mailing list then I can execute it and have it check for invalid entries. I need the script to link to an acknowledgement page when the information is entered. When I add the info to have it link when the data is entered then it does not do the validation check and it displays a line of code above the form.
<!DOCTYPE html PUBLIC "-W3CDTD HTML 4.01 TransitionalEN">
<html><head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
<script language="Javascript" type="text/javascript">
<!-- Begin
function resetform() {
document.forms[0].elements[1]=="";
}
function submitForms() { .....
View 1 Replies
View Related
Sep 11, 2010
I have a code like this to swop images in a menu:
Code:
<a href="javascript:staySet('btn-contact')""><img border="0" src='../images/btns-menu/btn-contact.png' id='btn-contact' onmouseover="SwapImage('btn-contact')" onmouseout="SwapImage('btn-contact')" alt='''.>
I need to create a onClick event which tells te link to open a html file <blabla.html> into a frameset name.
View 2 Replies
View Related
Jan 12, 2011
I am trying to tackle this problem: when I click on a link, the link show take me to another page and populate certain items (on the new page) in a form, such as a textbox and dropdown. I figured out how to populate the form using getElementById but I'm not sure how to open a link in the same window and bring those items to the new page. Below is the code I have so far:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
[code]....
The a href used to equal # previously as a test to make sure the function works (thats why I have the textbox on this page as well.The other page has the following code:
Code:
<form name="test"> <input id="info" type="text" /> </form>
View 2 Replies
View Related
Jan 3, 2010
HTML Code:
<ul id="toggle">
<li class="previous"><a id="prev" href="#cat">previous</a></li>
<li class="next"><a id="next" href="#dog">next</a></li>
</ul>
I'm trying to force previous to be hidden until next is clicked and when next is clicked the link will change from #dog to #sheep.
Does anyone know an article or something on this?
View 21 Replies
View Related
Jul 21, 2010
I am programming a website. On there website the users will be able to click "Add as friend". I am basically wanting it so that when my users click "Add as friend" the link will dis-appear and then it will visit a page on the iframe that I have already coded with a variable (addfriend.php?pid=CODEHERE).
If there is anyone that knows how I can make the code dis-appear using Ajax.
View 2 Replies
View Related
Mar 4, 2009
I am pretty new to JS but I've managed to create a function to show and hide a div according to a link's URL, but I am gonna have lots of url's and lots of div's to show and hide, its not a problem to show and hide them, the only trouble is that they stack, if I show div 1, and then press link 2 to show div 2, Div 2 is gonna be below div 1, and what I want is that when I click link 2 to hide div 1 or any other shown divs, I am sure its possible but i don't know how to do it. I think it would be possible by storing the id of the div in a variable, but the only problem is that when I call that function, the variable always changes so it would be a matter of storing the id in a variable outside the function, but i don't know how to do that, or what are the rules?
This is my code:
JS
function showHide(product) {
var el = document.getElementById(product);
el.className = (el.className == 'hide') ? '' : 'hide';
}
HTML
<div id="1" class="hide">Content of Div 1</div>
<div id="2" class="hide">Content of Div 2</div>
<a href="javascript:showHide('1');">Show Hide 1</a>
<a href="javascript:showHide('2');">Show Hide 1</a>
CSS
.hide {
display:none;
}
I need to have the javascript function call in href because of an applet I am using. In resume, the divs are hidden at the start, when I click one link, the div shows, when I click the other link I need the previous div shown to be hidden (class="hide"), and show the new div and so on.
View 4 Replies
View Related
Dec 1, 2009
I need a javascript code that allows me to hide a link at a certain time and show the link again at a certain time. my project requirement is that i need to be able to hide the link at a certain period of time to restrict users from acessing it.only from 12pm to 2pm the link will be display, users are able to click the link. after and before that timing, the link will not be displayed[hide] or the when click on the link error message will be shown.
View 11 Replies
View Related
