|
JavaScript - Hide/show Button Works In Ie Not Firefox
When I click the button, the images hide/show in IE, but this doesn't work in Firefox. I've tried JSLint and JavascriptLint, but haven't figured out what the issue is. Any help would be much appreciated!! This is the code below:
<script language="Javascript"> <![CDATA[ function openConsole(docId, attachmentFileName, name) { if (window.customOpenConsole) { customOpenConsole(encodeURIComponent(attachmentFileName), name); } else { headerFrame = window.parent.parent.frames["Header"]; if (headerFrame != null && headerFrame.openDocLink != null){ headerFrame.openDocAttachment(docId, attachmentFileName, name); } } } function STGhide() { var x=document.getElementsByName("ImageControlZone"); for(j=0;j<x.length;j++) { var imgs = x[j].getElementsByTagName('img'); for(i=0;i<imgs.length;i++) { imgs[i].style.display="none"; } } var link = document.getElementById("ShowHideButton"); //alert(link.innerHTML) link.innerHTML ="<img alt='' src='img/hideshow/showimage.gif' border='0' onclick='javascript:STGshow();' />"; } function STGshow() { var x=document.getElementsByName("ImageControlZone"); for(j=0;j<x.length;j++) { var imgs = x[j].getElementsByTagName('img'); for(i=0;i<imgs.length;i++) { imgs[i].style.display=""; } } var link = document.getElementById("ShowHideButton"); link.innerHTML ="<img alt='' src='img/hideshow/hideimage.gif' border='0' onclick='javascript:STGhide();' />"; } function openDocumentLink(externalId, languageId) { if (window.parent.openDocLink != null) { window.parent.openDocLink(externalId, languageId); } else { headerFrame = window.parent.parent.frames["Header"]; if (headerFrame != null && headerFrame.openDocLink != null) { headerFrame.openDocLink(externalId, languageId); } else { setTimeout("openDocumentLink('"+externalId+"','"+languageId+"')",500); } } } ]]> </script> Similar TutorialsHelp is greatly appreciated!! I have two radio buttons on a form. I wish for one button to show a div that's hidden with {display:none;}, and the other to put it back to being hidden when selected. My code seemed sound to me but in firefox it doesn't really work, only in internet explorer. I would like to keep the coding as simple as possible: Code: style:
.hidden{display:none;}
script:
function show() {document.getElementById("hide").style.display = 'inline'}
function hidden() {document.getElementById("hide").style.display = 'none'}
body:
How old are you?<br/>
<input type="radio" name="age" onclick="return hidden();" value="yes"/>over 25<br/>
<input type="radio" name="age" onclick="return show();" value="no"/>25 or under<br/>
<div id=hide class="hidden">
Do you have over 2 years of experience?<br/>
<input type="radio" name="experience" value="yes"/>yes<br/>
<input type="radio" name="experience" value="no"/>no<br/>
</div>
i'm still a relative noob and this has me stuck - i have a save button with a "save as copy" in the save dropdown list. add new item directs to a premade/formatted project that is used as a template, so on that item i only want/need the "save as copy" but on all other items that use the form i need to only have the "save" function. is there any way to either change the function of the button depending on item that is being viewed in the edit screen OR hide the "save" button and only show the button associated with "save as copy - and vis versa for the rest of the items?? current button code is - protected function getToolbar() { $options = array(); $user = JFactory::getUser(); $create_ms = $user->authorise('core.create', 'com_pfmilestones'); $create_task = $user->authorise('core.create', 'com_pftasks'); $options[] = array( 'text' => 'JSAVE', 'task' => $this->getName() . '.save'); $options[] = array( 'text' => 'Save as new project', 'task' => $this->getName() . '.save2copy', 'options' => array('access' => ($this->item->id > 0))); PFToolbar::dropdownButton($options, array('icon' => 'icon-white icon-ok')); item used as template is id=8 any help or suggestions would be greatly appreciated.. Hey guys, dont suppose any of you kind folks could help me out with a bit of code could you please? Heres the code - <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ var s = $('#slide'), w = $(s.find('span')[0]).width(); s.css({width: 0, overflow: 'hidden', whiteSpace: 'nowrap'}); $('#clicky').toggle(function(){ s.stop(true).animate({width: 0}, {duration: 'slow', queue: false, complete: function(){s.hide();}}); }, function(){ s.stop().animate({width: w}, {duration: 'slow', queue: false}); }); }); </script> <style> #slide{ float:left; width:200px; height:100px; background:yellow; margin-left:20px; } #next{ float:left; width:200px; height:100px; background:red; margin-left:20px; } </style> </head> <body> <input name="" type="button" value="Navigation" id="clicky"><br> <br> <div id="slide"> <h1><span>Hello World!</span></h1> </div> <div id="next"></div> </body> </html> Now my problem, when you first load the page and click the navigation button it dosent behave as it should. If you press the button a second time it behaves perfect and then for each button click it works as it should, its just the very first button click, it dosent seem to scroll across. Any ideas what i have done wrong in my code? Thanks I want some thing that when i click a button it shows a div then hides the button. I found this: Code: <script language="JavaScript">
function setVisibility(id, visibility) {
document.getElementById(id).style.display = visibility;
}
</script>
<input type=button name=type value='Show Layer' onclick="setVisibility('sub3', 'inline');";><input type=button name=type value='Hide Layer' onclick="setVisibility('sub3', 'none');";>
<div id="sub3">Message Box</div>
But it has two buttons that show and then hide the div, i only want one that shows the div then hides the button. Please help. Hi, I need a button that not only resets what is typed in the textarea but also hides all shown tables... Here's how my current set up is... ---------text area------ with a reset button table1 title (when clicked, shows a table under it) table2 title (when clicked, shows a table under it) table3 title (when clicked, shows a table under it) the tables under the main tables have buttons that when clicked on inserts texts in the textarea. Any help would be much much appreciated! Hello, For starters I'm a real javascript noob. The problem is I've got some code which which should display the contents of a div depending on which of two radio buttons are selected. Works fine in IE, but in Firefox, or even Safari it will display both divs if both are clicked. In other words it won't hide the div while it displays the other. The code is below, and any help would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Help! </TITLE>
<style type="text/css">
.hide {display: none}
</style>
<script type="text/javascript">
function hideDivArea(str_area_hide){
tag = document.getElementsByTagName("div");
for(x=0;x<tag.length; x++)
{
if(tag[x].getAttribute('id').indexOf(str_area_hide) != -1)
{
tag[x].style.display = "none";
}
}
}
function showDivArea(areas_show, areas_hide){
for (var i = 0; i < areas_show.length; i++)
{
ge = document.getElementById(areas_show[i]);
ge.style.display = "block";
}
for (var i = 0; i < areas_hide.length; i++)
{
hideDivArea(areas_hide[i]);
}
}
</script>
</HEAD>
<BODY>
<form action="feedout.php" method="post">
<input type="hidden" name="action" value="sendmail" />
<table style="width: 435px" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td height="15" valign="bottom">Do you Own or Rent?:<span class="redtext">*</span></td>
<td valign="bottom"> </td>
</tr>
<tr height="30">
<td colspan="2">
<div>
<input type="radio" name="ownRent" value="own" size="34" onclick="javascript:showDivArea(['own'], ['rent'])">Own
<input type="radio" name="ownRent" value="rent" size="34" onclick="javascript:showDivArea(['rent'], ['own'])">Rent
<div class="hide" id="own">
Lawyer Name:<br />
<input type="text" name="lawyerName" size="34"><br />
Address:<br />
<input type="text" name="lawyerAddress" size="34"><br />
Telephone Number:<br />
<input type="text" name="lawyerPhone" size="34"><br />
</div>
<div class="hide" id="rent">
Landlord Name:<br />
<input type="text" name="landlordName" size="34"><br />
Address:<br />
<input type="text" name="landlordAddress" size="34"><br />
Telephone Number:<br />
<input type="text" name="landlordPhone" size="34"><br />
</div>
</div>
</td>
<tr>
<td>
<table width="240" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="105" colspan="1" valign="middle" bordercolor="#000000" bgcolor="#ffffff">
<input style="border: solid 1px black;" type="submit" value="Submit Form">
</td>
<td width="20" height="35">
</td>
<td width="54" valign="middle"><input style="border: solid 1px black;" name="reset" type="reset" value="Clear Form"> </span></td>
</tr>
</tbody>
</table>
</td>
<td> </td>
</tr>
</tbody>
</table>
</form>
</BODY>
</HTML>
Hi I need help getting my show/hide function to work in all browsers. The function below works everywhere but Firefox. Can someone see why it's not working? My javascript function: Code: <script language="javascript" type="text/javascript">
function hideShow(el_id){
var el=document.getElementById(el_id);
if(el_id.style.display!="none"){
el_id.style.display="none";
}else{
el_id.style.display="";
}
}
</script>
My php code (sensured): PHP Code: $sql="*****"; $result= mssql_query($sql); echo "<table>"; echo "<tr><th>Header1</th><th>Header2</th><th>Header3</th><th>Header4</th></tr>"; $row=0; $row2=1; while($row = mssql_fetch_array($result)) { $id=$row["id"]; $row++; $row2++; echo "<tr>"; echo "<td>". $row['field1'] ."</td>"; echo "<td>". $row['field2'] ."</td>"; echo "<td><a onclick='hideShow(row$row);'> hide/show details</a></td>"; echo "</tr>"; echo "<tr id='row$row' style='display:none;'>"; echo "<td><b>Input1: </b>". $row['field3']."</td>"; echo "<td><b>Input2: </b>". $row['field4'] ."</td>"; echo "<td><b>Input3: </b>". $row['field5'] ."</td>"; echo "<td><a onclick='hideShow(row$row2)'>Delete this info</a></td>"; echo "</tr>"; echo "<tr id='row$row2' style='display:none;'>"; echo "<td>Are you sure you want to delete?</td>"; echo "<td><a onClick=menuRequest('$id')>Yes</a></td>"; echo "<td><a onClick=menuRequest('home')>No</a></td>"; echo "</tr>"; $row++; $row2++; } Title explains it really. The button I am using working perfecting in FireFox and Chrome but not in Internet explorer. (Yes I know someone that actually uses IE that pointed this out to me) The rest of the code works fine but just not the reset button I have. Something I have been needing to do is make the code call my images differently by putting them in an array so I don't mess this the sources of my images like I sloppily am here, but I am not sure if that will actually fix the problem I am have. The checkbox should both uncheck the box(if checked) AND change the picture but it only unchecks the box. Here is the relevant code let me know if you want me to post the whole thing. Code: function reset(){
cb1.checked=false;
document.goodAfternoon.src=goodAfternoonFinal.src;
}
Code: "Check" me out;) <input type="checkbox" id="cb1" onClick="validate()" /> <img src="Good Afternoon.gif" name="goodAfternoon"> <input type="button" id="cb2" value="RESET" onClick="reset()"/> Hello, I'm not really a techie but I was feeling a little adventurous this morning so I thought I'd try to follow some tips online to customize a "buy" button for some products that I'm preparing to sell online at what is currently: www.SensoryEscapeImages.Squarespace.com If you visit this site, then click on "Photo Gallery" on the top nav, then click on the 4th image to the right on the top row of thumbnails, you will see on the overlay, at the bottom, three dropdowns that I'm trying to affect. So, there are three fields presented with the Buy button: Size, Format, and Trim & Finish. If I were to select the Size of 8 x 12 in the first dropdown, the behavior that I am striving for is to only show the Formats available in that size in the second dropdown. Subsequently, each format has Trim & Finish options exclusive to that format and I'm aiming to only make those show in the Trim & Finish dropdown. But it aint working. Here's the code that I started. No laughing <left><form action="https://www.e-junkie.com/ecom/gb.php?c=cart&i=563148&cl=74166&ejc=2" target="ej_ejc" method="POST" name="condition" accept-charset="UTF-8"> <table><tr><td>Size:<select name="o1"> <option value="8 x 12">8 x 12</option> <option value="12 x 18">12 x 18</option> <option value="16 x 24">16 x 24</option> <option value="20 x 30">20 x 30</option> <option value="24 x 36">24 x 36</option> <option value="30 x 45">30 x 45</option> </select></td><td>Format:<select name="o2"> <script type="text/javascript"> if (condition.o1.options = 0) { document.write("<option value="Print $50">Print $50</option> <option value="Print on Gatorboard $80">Print on Gatorboard $80</option> <option value="Canvas $125">Canvas $125</option>"); } if (condition.o1.options = 1) { document.write("<option value="Print $90">Print $90</option> <option value="Print on Gatorboard $125">Print on Gatorboard $125</option> <option value="Canvas $145">Canvas $145</option>"); } if (condition.o1.options = 2) { document.write("<option value="Print $125">Print $125</option> <option value="Print on Gatorboard $165">Print on Gatorboard $165</option> <option value="Canvas $220">Canvas $220</option> <option value="High Def Metal Print $575">High Def Metal Print $575</option>"); } if (condition.o1.options = 3) { document.write("<option value="Print $170">Print $170</option> <option value="Print on Gatorboard $230">Print on Gatorboard $230</option> <option value="Canvas $325">Canvas $325</option> <option value="High Def Metal Print $725">High Def Metal Print $725</option>"); } if (condition.o1.options = 4) { document.write("<option value="Print $215">Print $215</option> <option value="Print on Gatorboard $300">Print on Gatorboard $300</option> <option value="Canvas $430">Canvas $430</option> <option value="High Def Metal Print $830">High Def Metal Print $830</option>"); } if (condition.o1.options = 5) { document.write("<option value="Print $250">Print $250</option> <option value="Print on Gatorboard $340">Print on Gatorboard $340</option> <option value="Canvas $535">Canvas $535</option> <option value="High Def Metal Print $1">High Def Metal Print $1</option>"); } </script></select></td> <td>Trim and Finish:<select name="o3"> <script type="text/javascript"> if (condition.o2.options = 1 || condition.o2.options = 4 || condition.o2.options = 7 || condition.o2.options = 11 || condition.o2.options = 15 || condition.o2.options = 19) { document.write("<option value="None">None</option>"); } if (condition.o2.options = 0 || condition.o2.options = 3 || condition.o2.options = 6 || condition.o2.options = 10 || condition.o2.options = 14 || condition.o2.options = 18) { document.write("<option value="1/4 Inch White Trim">1/4 Inch White Trim</option> <option value="1/4 Inch Black Trim">1/4 Inch Black Trim</option>"); } if (condition.o2.options = 2 || condition.o2.options = 5 || condition.o2.options = 8 || condition.o2.options = 12 || condition.o2.options = 16 || condition.o2.options = 20) { document.write("<option value="White Sides">White Sides</option> <option value="Black Sides">Black Sides</option> <option value="Stretched Sides">Stretched Sides</option>"); } if (condition.o2.options = 9 || condition.o2.options = 13 || condition.o2.options = 17 || condition.o2.options = 21) { document.write("<option value="Silver Recessed Frame">Silver Recessed Frame</option> <option value="Silver Frame to Edge">Silver Frame to Edge</option> <option value="Black Recessed Frame">Black Recessed Frame</option> <option value="Black Frame to Edge">Black Frame to Edge</option> <option value="Pewter Recessed Frame">Pewter Recessed Frame</option> <option value="Pewter Frame to Edge">Pewter Frame to Edge</option>"); } </script></select></td> <td><input type="image" src="http://www.e-junkie.com/ej/ej_add_to_cart.gif" border="0" alt="Add to Cart" class="ec_ejc_thkbx" onClick="javascript:return EJEJC_lc(this.parentNode);"/> </form></td></tr></table></left> Hi, I am not entirely sure what I am doing wrong here, and I have been looking at this for ages, so apologies in advance if I have become so bleary eyed I can't see something simple. I use php to create buttons based on values pulled for a table. The problem I have is when you click on the first button the javascript function works great, when you click on the next button you get the same output even though it should be different results. I am working in ff and I can see on my firebug console that the javascript function is being called, but it is not passing the new value of the second or third button, it just keeps repassing the value of the first button. So not entirely sure where I am going wrong here. My page is: Code: <script type="text/javascript">
function loadXMLDoc2(File,ID,Msg){
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
try{
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(ID).innerHTML=xmlhttp.responseText;
}
}
var params=Msg;
xmlhttp.open("POST",File,true);
xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache");
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-length", params.length);
xmlhttp.setRequestHeader("Connection", "close");
xmlhttp.send(params);
}
</script>
<head>
<body>
<?php
$con = mysql_connect("localhost","user","password");
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("mydb", $con);
$result = mysql_query("SELECT DISTINCT theme FROM goods WHERE category='{$_POST['category']}'
ORDER BY theme DESC");
while($row = mysql_fetch_array($result)){
echo '<input type="text" class="hidden" name="theme" id="theme" value="' . $row['theme'] . '" ><input type="button" class="button3" name="product" id="product" value="' . $row['product'] . '" onClick="loadXMLDoc2(\'getShow.php\',\'txtHint\',\'theme=\'+encodeURI(document.getElementById(\'rtheme\').value))" > ';
}
echo '<br /><br />
<div id="txtHint"><div>
<br />
<br />';
mysql_close($con);
?>
And getShow.php produces a table with a list of product images, names and prices, based on theme. So basically not sure where I am going wrong here? 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> 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? 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! 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> 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. 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 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 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 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. |
|||||||