|
JavaScript - Show Hide Text Box
Hi
Im looking for a way to show hide text box on select option change PHP Code: <select name="letter_type" id="lt"> <option value="Registered">Registered</option> <option selected="selected" value="Unregistered">Unregistered</option></select> <input name="textfield7" id="regty" type="text" accesskey="1" tabindex="1" size="20" /> i wana show that text box if user select "Registered" from select option. any help would be great sorry for language errors. Thanks Similar TutorialsApologies if this question has been asked a million times. I am fairly new to this game, have got my head around html & css and now it's time to add a little interactivity... BUT i've hit my first brick wall... I am setting up a (big) panel of text which i wish to present in a more reasonable fashion by hiding the content and only showing the headers. Got the Hide:Show function working ok as shown below, but I am stuck on my next requirement... Basically The hidden text will show and hide when told by clicking on the relevant header - but i wish to hide the text in a visible area when clicking on a new header. I have: Header1 (on click) | bodycopy - visible Header2 | bodycopy - hidden leading to: Header1 | bodycopy - visible Header2 (on click) | bodycopy - visible But i'm after: Header1 (on click) | bodycopy - visible Header2 | bodycopy - hidden leading to: Header1 | bodycopy - hidden Header2 (on click) | bodycopy - visible Here is the code i'm using: Code: <!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>Untitled Document</title>
<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>
<style type="text/css">
<!--
#slide_text1 {
font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; line-height: 1.4em;
color: #000; margin-bottom: 15px; }
#slide_text2 {
font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; line-height: 1.4em;
color: #000; margin-bottom: 15px; }
.h3_toggle {
font-family: Arial, Helvetica, sans-serif; font-size: 1em; line-height: 1.2em;
color: #999; text-decoration: none;}
.h3_toggle:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
line-height: 1.2em;
color: #333;
text-decoration: none;
cursor: crosshair;
}
-->
</style>
</head>
<body>
<h3><a class="h3_toggle" onclick="toggle_visibility('slide_text1');">First heading </a> </h3>
<div style="display:none;"" id="slide_text1">Body copy content to be hidden lives in this area</div>
<h3><a class="h3_toggle" onclick="toggle_visibility('slide_text2');">Second heading</a> </h3>
<div style="display:none;"" id="slide_text2">Body copy content to be hidden lives in this area</div>
</body>
</html>
Any help from you all is very much welcome (or if this has been answer before - a nudge in the direction of the answer please) Thanx, Ozwaldo. I can I take a code like this: Code: <script language="javascript">
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "show";
}
else {
ele.style.display = "block";
text.innerHTML = "hide";
}
}
</script>
<a href="javascript:toggle();" id="displayText">Show/Hide</a>
<div id="toggleText" style="display: none;">This is Hidden Text</div>
But make it so you see "Show" before you click, then change the text to "Hide" once you click the link? Code: <html>
<title> random!!</title>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.min.js"></script>
</head>
<body>
<div class="one" style="cursor: pointer;">
type1<br/><br/></div><div class="two" style="cursor: pointer;">type2<br/><br/></div><div class="three" style="cursor: pointer;">type3<br/><br/></div>
<div class="oneone">atrdjgkhgfyfygfykfyfkygfvkgvkhgv</div><div class="twotwo">hgfihygohgohsgoihgolhgshgoshdgchchj</div><div class="threethree">siucgdiuhsbcohbscjbsidjcksjdnck</div>
<script type="text/javascript">
$(document).ready(function()
{
$('div.twotwo').hide();
$('div.threethree').hide();
$('div.one').toggle(function()
{
$('div.twotwo').hide();
$('div.threethree').hide();
$('div.oneone').fadeIn('slow');
}, function()
{
return false;
});
$('div.two').toggle(function()
{
$('div.oneone').hide();
$('div.threethree').hide();
$('div.twotwo').fadeIn('slow');
}, function()
{
return false;
});
$('div.three').toggle(function()
{
$('div.twotwo').hide();
$('div.oneone').hide();
$('div.threethree').fadeIn('slow');
}, function()
{
return false;
});
});
</script>
</body>
</html>
The following code works perfectly when clicked once in each of the sub divisions(type1, type2, type3) for hide/show. But from the next time onwards we will have to click twice to initiate the hide/show. Can anyone suggest changes to make the code work as desired??.. P.S: sorry if i have made any stupid mistake.. i am quite new to this!! Hi need a bit of expert help with some thing i am trying to achive but cant find any code on line. all i want to do is to have a list of items in a div box on the left of the screen and when i click on one of them it shows a div box with the related text on the right side of screen in the second div box and hides any previouse showing divs on the right. Thanks Ralph This should be a simple fix.. I hope. JS: Code: //-- This is a really awful script and if it could be re-written by someone who knows what they're doing that would be incredible.
window.addEvent('domready', function() { //new event wooooo
// -- vertical2
var myVerticalSlide = new Fx.Slide('vertical_slide'); //declaring the variable with the FXSlide property
var toggleThis = $('v_toggle'); //toggle variable
myVerticalSlide.hide(); //hides the variable off the bat.
toggleThis.addEvent('click', function(event){ // uses the type 'click' the id on the link, giving it the following function
event.stop(); //Prevents browser from following the link and instead initiates the next line
myVerticalSlide.toggle(); //Togles the div declared in the variable VerticalSlide
});
});
HTML: Code: <div>
<a id="v_toggle" href="#">Question 1</a>
<div id="vertical_slide">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
<div>
<a id="v_toggle" href="#">Question 2</a>
<div id="vertical_slide">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
I'm new to JS (and any programming language, i just know HTML, CSS/SASS) . I tried to make the code as stupid-simple as I could, as you can see with all the comments. The problem is when you click on question1, all the answers show. I just want the answer below the question to show. How can I write this to just show one answer at a time. Any explanation would be a huge help or a point in the right direction would be great help. I'd love to learn how to fix this as opposed to just copying pasting :\ this is what im trying to do: http://www.linkstraffic.net/programm...d/movebox.html using this code: http://www.linkstraffic.net/programm...nd/movediv.php heres my code. can someone fix it? html: [CODE] <!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>Chris MacDonald - Javascript Assignment 2</title> <link href="styles/styles.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="java.js"></script> <div id="header"> <div id="logo"><img src="images/beat.png" /></div> </div> <ul id="nav"> <li><a href="#">Home</a></li> <li><a href="http://beatthreads.bigcartel.com/category/tees">Shirts</a></li> <li><a href="#">About Us</a></li> </ul> </head> <body> <div id="content"> <a href="#" onclick="interv=setInterval('ShowBox()',3);return false;">Upcoming Designs</a> <div id="coverlogin"> <div id="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tristique cursus dui, a venenatis diam consectetur fermentum. Nulla facilisi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent aliquam ornare nunc non semper. Morbi blandit lectus non elit ultricies ultricies. Fusce mattis purus et eros ultrices et facilisis nulla consequat. Vestibulum tellus libero, tempor vel tincidunt nec, consectetur non ante. Donec sed malesuada felis. Mauris lorem lorem, ornare a rutrum quis, rutrum in mauris. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. <br/> <p align="left"><a href="#" onClick="interv=setInterval('HideBox()',3);return false;">X</a></p> </div> </div> </div> <div id="footer"> <div id="footertext">Beat Threads - 2010</div> </div> </body> </html> [CODE] javascript: // JavaScript Document var hh=0; var interv; //we show the box by setting the visibility of the element and incrementing the height smoothly function ShowBox() { //Depending on the amount of text, set the maximum height here in pixels if(hh==40) { clearInterval(interv); return; } obj = document.getElementById("coverlogin"); obj.style.visibility = 'visible'; hh+=2; obj.style.height = hh + 'px'; } function HideBox() { obj = document.getElementById("coverlogin"); if(hh==2) { obj.style.visibility = 'hidden'; obj.style.height = '0.1em'; clearInterval(interv); return; } hh-=2; obj.style.height = hh + 'px'; } [CODE] Can someone fix this for me? Hello, I have the folowing code but it seems to be broken between "SM Decision Support" and "Incident and Request Management". Does anyone know how I resolve ?. The idea is when somebody opens the page all the sections are hidden/uncollapsed and the user can collapse individually each section with a click or by hitting the expand/collapse all link. ------------ Have placed code in attachment as too long for this section Im pretty new to JS so Im sure this is not the best way to go about this but it'll do for now, any suggestions welcome I have a script to show and hide various divs based on a function & var. The problem im having is that when ANY of the variables ('hate', 'ok' and 'love') are passed all 3 different feedback forms ('FeedbackHate', 'FeedbackOk' and 'FeedbackLove') appear, not just the one I want. here is the JS: Code: function sitesurveyswitch(emotion) {
var e = emotion;
document.getElementById('site_survey_hate').style.backgroundPosition = '0px 0px';
document.getElementById('site_survey_ok').style.backgroundPosition = '0px 0px';
document.getElementById('site_survey_love').style.backgroundPosition = '0px 0px';
document.getElementById('FeedbackHate').style.display = 'none';
document.getElementById('FeedbackOk').style.display = 'none';
document.getElementById('FeedbackLove').style.display = 'none';
if (e == 'hate')
document.getElementById('site_survey_hate').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackHate').style.display = 'block';
if (e == 'ok')
document.getElementById('site_survey_ok').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackOk').style.display = 'block';
if (e == 'love')
document.getElementById('site_survey_love').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackLove').style.display = 'block';
}
and here is the code related to this function: Code: <div id="siteSurveyBox">
<span id="site_survey_hate" onclick="sitesurveyswitch('hate');return false;"></span>
<span id="site_survey_ok" onclick="sitesurveyswitch('ok');return false;"></span>
<span id="site_survey_love" onclick="sitesurveyswitch('love');return false;"></span>
</div>
<div id="FeedbackHate" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
<div id="FeedbackOk" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
<div id="FeedbackLove" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
Hi guys, im new to forums and need some help with my website. I have embed a flash player known as: JW player into my website and put it into a div. Now my problem is I want javascript to hide the div containing the flash player for atleast a few seconds to display a loading image.gif. How would I set this up? Im not to familiar about using javascript so im not sure if its even possible. Anways thx for any help ore suggestions related to this subject. ok trying to get a Div tag to show if something is True and hide if something is False JS Code: unction eToggle(anctag,darg)
{
var ele = document.getElementById('Module1');
var ele = document.getElementById('Module2');
var ele = document.getElementById('Module3');
var ele = document.getElementById('Module4');
if("module1" + "module2" + "module3" + "module4" <40)
{
div.id.Failed = "block";
div.Failed = "Failed";
}
else
{
div.style.Passed = "block";
div.Passed = "show";
}
}
HTML Code: <div id="Fail" class="hidden" style="display: none"><b><i>You will need to Repeat the Semester!</b> <br /> </div> <div id="Passed" class="hidden" style="display: none"> <img src="faces.png" width="50" height="50"><b><i> "Good Job you passed the Semster!"</b></div> Hello, I'm trying to have a div be hidden on loading the page but when you click a link it will show the div... here's code I have but it doesn't show when you click the link... <script type="text/javascript"> function show(){ document.getElementById(test).style.display="block"; } </script> <div id="test" style="display:none;"> <p>Some text</p> </div> <a href="#" onclick="show(); return false;">Show</a> Code: <html>
<head>
<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
<script type="text/javascript">
function showonlyone(thechosenone) {
var noticecontent = document.getElementsByTagName("div");
for(var x=1; x < noticecontent.length; x++) {
name = noticecontent[x].getAttribute("name");
if (name == 'noticecontent') {
if (noticecontent[x].id == thechosenone) {
noticecontent[x].style.display = 'block';
}
else {
noticecontent[x].style.display = 'none';
}
}
}
}
</script>
</head>
<body>
<center>
<div id="parentdiv">
<div id="expandall">OPEN/CLOSE ALL</div>
<div id="noticeheading1" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent1');">Heading 1</div>
<div id="noticecontent1" name="noticecontent" class="noticecontent">awertysergyetwhwgertrhztrxdtykpopmift6hwe5awfwedaserhdy4hatefeshdgtrgd</div>
<div id="noticeheading2" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent2');">Heading 2</div>
<div id="noticecontent2" name="noticecontent" class="noticecontent">fh56serhgzsrxdtrjhgzsrltkjuytinubvre6io4exjhgftxtrokzet6ttawruthrthwru</div>
<div id="noticeheading3" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent3');">Heading 3</div>
<div id="noticecontent3" name="noticecontent" class="noticecontent">fdfjesrtaw5u4wgy5gw45use4syzerhgtawerfatrastaghgryseerathw5uz4de5ser5s</div>
</div>
</center>
</body>
</html>
can anyone help on "OPEN/CLOSE ALL" to show or hide all .noticecontent divs Hi all, Check this code: PHP Code: <a>text</a> <div id="pkg">pkg</div> <div id="table_pkg">table_pkg</div> I'd like to show table_pkg and hide pkg when I click on <a>text</a>. How can I do? Thank you very much I don't know a lot about Javascript... still learning.. I am trying to create a show/hide effect that displays an image based on the users text input. I have coded this before for a list/menu and it works fine. With this particular project there are too many selections to choose from to put in a list/menu. I am trying to use if and else if statements to make this work. With the code the way it is only the first function on the list works. I tried just using repeating if statements and only the last function on the list works. Here is the code: Code:
<script type="text/javascript" >
function showSample() {
if (document.getElementById('input').value='SW001') {
document.getElementById('SW001').style.display='block';
document.getElementById('SW002').style.display='none';
document.getElementById('SW003').style.display='none';
document.getElementById('SW004').style.display='none';
}
else if (document.getElementById('input').value='SW002') {
document.getElementById('SW001').style.display='none';
document.getElementById('SW002').style.display='block';
document.getElementById('SW003').style.display='none';
document.getElementById('SW004').style.display='none';
}
else if (document.getElementById('input').value='SW003') {
document.getElementById('SW001').style.display='none';
document.getElementById('SW002').style.display='none';
document.getElementById('SW003').style.display='block';
document.getElementById('SW004').style.display='none';
}
else if (document.getElementById('input').value='SW004') {
document.getElementById('SW001').style.display='block';
document.getElementById('SW002').style.display='none';
document.getElementById('SW003').style.display='none';
document.getElementById('SW004').style.display='none';
}
else if (document.getElementById('input').value='SW005') {
document.getElementById('SW001').style.display='none';
document.getElementById('SW002').style.display='none';
document.getElementById('SW003').style.display='none';
document.getElementById('SW004').style.display='block';
}
}
</script>
<style type="text/css">
<!--
#main {
width: 400px;
margin-right: auto;
margin-left: auto;
height: 125px;
}
#imageArea {
float: right;
width: 200px;
}
#formArea {
float: left;
width: 200px;
height: 125px;
}
.image {
height: 125px;
width: 125px;
margin-right: auto;
margin-left: auto;
display: none;
}
#SW001 {
background: url(../_images/Colorfil/SW0001.jpg) no-repeat center center;
}
#SW002 {
background: url(../_images/Colorfil/SW0002.jpg) no-repeat center center;
}
#SW003 {
background: url(../_images/Colorfil/SW0003.jpg) no-repeat center center;
}
#SW004 {
background: url(../_images/Colorfil/SW0004.jpg) no-repeat center center;
}
#SW005 {
background: url(../_images/Colorfil/SW0005.jpg) no-repeat center center;
}
-->
</style>
</head>
<body>
<div id="main">
<div id="imageArea">
<div class="image" id="SW001"></div>
<div class="image" id="SW002"></div>
<div class="image" id="SW003"></div>
<div class="image" id="SW004"></div>
<div class="image" id="SW005"></div>
</div>
<div id="formArea">
<form action="" method="get">
<input type='text' name="input" id='input' />
<input name="" type="button" onclick="showSample(this.selectedIndex)"/>
</form>
</div>
</div>
</body>
</html>
Any help would be greatly appreciated! Here is my code to show and hide two division via two links ... Nothing is happening......Can you plz suggest me, where I am wrong ? <html> <head> <script language="javascript" type="text/javascript"> function toggle(show, hide) { document.getElementByid(show).style.display = "block"; document.getElementByid(hide).style.display = "none"; } </script> </head> <body> <div> <a href="javascript:void()" onclick="toggle('first','second');" > First </a> <br/> <a href="javascript:void()" onclick="toggle('second','first');"> Second</a> <div id="first" style="display:none"> First division</div> <div id="second" style="display:none"> this is second division</div> </div> </body> </html> Good afternoon all, I need a bit fo help with unhiding a selection. I have a 10 checkboxes on a form. When the user clicks one of the boxes the rest are hidden and a comments box shows. That works great, the part I can't figure out is how to make all the boxes show again if the user unchecks the checkbox and make the comments box hide again. Here is the code I am using to do the hide: Code: function HideComments()
{
var a1 = document.getElementById("crmForm_answer1").checked;
var a8 = document.getElementById("crmForm_answer8").checked;
var a2 = document.getElementById("crmForm_answer2").checked;
var a3 = document.getElementById("crmForm_answer3").checked;
var a4 = document.getElementById("crmForm_answer4").checked;
var a5 = document.getElementById("crmForm_answer5").checked;
var a6 = document.getElementById("crmForm_answer6").checked;
var a7 = document.getElementById("crmForm_answer7").checked;
var a9 = document.getElementById("crmForm_answer9").checked;
var a10 = document.getElementById("crmForm_answer10").checked;
if(a1==true)
{
document.getElementById("crmForm_answer1_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer1_value").parentNode.parentNode.style.display = 'none';
if(a8==true)
{
document.getElementById("crmForm_answer8_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer8_value").parentNode.parentNode.style.display = 'none';
if(a2==true)
{
document.getElementById("crmForm_answer2_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer2_value").parentNode.parentNode.style.display = 'none';
if(a3==true)
{
document.getElementById("crmForm_answer3_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer3_value").parentNode.parentNode.style.display = 'none';
if(a4==true)
{
document.getElementById("crmForm_answer4_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer4_value").parentNode.parentNode.style.display = 'none';
if(a5==true)
{
document.getElementById("crmForm_answer5_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer5_value").parentNode.parentNode.style.display = 'none';
if(a6==true)
{
document.getElementById("crmForm_answer6_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer6_value").parentNode.parentNode.style.display = 'none';
if(a7==true)
{
document.getElementById("crmForm_answer7_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer7_value").parentNode.parentNode.style.display = 'none';
if(a9==true)
{
document.getElementById("crmForm_answer9_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer10").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer9_value").parentNode.parentNode.style.display = 'none';
if(a10==true)
{
document.getElementById("crmForm_answer10_value").parentNode.parentNode.style.display = 'block';
document.getElementById("crmForm_answer1").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer8").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer2").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer3").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer4").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer5").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer6").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer7").parentNode.parentNode.style.display = 'none';
document.getElementById("crmForm_answer9").parentNode.parentNode.style.display = 'none';
}
else
document.getElementById("crmForm_answer10_value").parentNode.parentNode.style.display = 'none';
}
Thanks in advance for the help, Sam. I know that this can be done using .hide/.show... I don't know how to say this but if you'll look at the code: Code: <div id="isclickable"> klasdlkasdklaklsjd <div id="weeeee"> trolololololol </div> </div> <div id="isclickable"> klasdlkasdklaklsjd <div id="weeeee"> trolololololol </div> </div> The div having an id of "weeeee" will show if id="isclickable" is clicked.. but not all divs having "weeeee" should show but instead what is inside the div "isclickable" is there a way to attain this without creating multiple scripts and ids? Thanks> i've been using the show/hide function for this webpage http://dannycremers.com/HELP.html when you click on test 2 it works perfectly but when you click on test 3 there's an error and i don't know how to solve it as you can see 'test 3' pops up on the top of the list automatically.. and when i try to delete it.. the 'test 3' link that i want to keep disappears as well.. and ideas how to solve this easily? I have a previous post where I asked about showing or hiding a div based on user answers in a form, and I got a great response that let me do that with radio buttons ... but can I do that with drop down lists too? Is there an equivalent to on click for drop down list? Thanks for all the help.
Hi, I'll explain my situation: I'm completely new to javascript so what i want to do is make a script that shows a specific div when the visitor is at the homepage but hide it when hes in another page of my website. i've read some people trying to explain it to someone else but it seems that i need to learn many aspects of the javascript language to edit it to my needs. I'm a med student and im really tight in my schedule and have almost no extra time to sit and read about javascript just so i can do this one specific thing. Would you please help me out? I've been trying to figure this out on my own for the past 3 days with no success. I will greatly appreciate it if someone helps me. PLEASE... |
|||||||