|
JavaScript - Onmouseover + Onclick Problem
hi
i have a problem coding a menu i have 4 links on menu and clicking on items should expand a DIV and change the menu item image. also rollover has to change the image too i mean 3 conditions for every menu item: normal, rollover, clicked. i have no problem with rollover but when item is been clicked and image changes, image has to change on mouse over again, but has not to change to original image on mouse out. also clicking on another menu item has to change the previous item image to original. i'm confused enough i tried by samples over and over. but the main problem is that i dont know js syntaxes and coding however, anybody could help??? Similar TutorialsHi, I use mostly PHP with my office's website as it usually requires some interaction with the server. However, i would like to do something that does not, and figured JS should be able to take care of it. I just can't get my head around it and would like to ask for some guidance...not the answer per say, just helping me get on the right path would be great! What i would like to do seems rather simple: I have a calendar. I would it to do one of two things: 1. Using onclick, when the user clicks on a date, i would like it to print something underneath the calendar. Similar to an error message that shows up on a login form if you type something wrong in a field using PHP (if(isset($whatever))). 2. Or using onMouseover, if the user hovers over a date that i have something special scheduled, i want a message to either pop up (alert()) or similar to #1, show up below the calendar. While fiddling with it this afternoon i figured i was close, but i am missing something... Code: <td><a href="#" onclick="document.getElementById("27").innerHTML='President's Day'; return false;">27</a></td>
But this seems to be pulling information from an element whose id = 27...which is not what i'd like.. Thanks in advance, Tsiqueira Hello, I have some database widgets. I want the user to be able to mouseover the widget and see a popup window of a synopsis of the database. If the user would like to access the database, I would like them to have the onClick option. <head> [CODE] <script> function openPopUp(URL) { new_window = window.open(URL, 'window', 'toolbar=0,scrollbars=0,location=0, statusbar=0,menubar=0,resizable=0,width=650,height=300,left = 350,top = 280'); } function closePopUp() { new_window.close(); } </script> [CODE] <Body> [CODE] <a href="#" onMouseOver="openPopUp('http://jpl.coj.net/res/db/popups/abc-clio.html')" onMouseOut="closePopUp(''http://jpl.coj.net/res/db/popups/abc-clio.html')"><img src="http://jpl.coj.net/pics/logos/abc-clio.jpg" alt="ABC-CLIO Databases" width="164" height="42" border="0"/></a> <URL of database> http://databases.abc-clio.com/Multi/ Can this be done? Thank you for your help, Elbee Hello all, I am just starting out trying to learn javascript and I am looking for a good forum to help me get through all the roadblocks I'm sure to hit. This looks like a very active place so hopefully I'll find some good help! Right now I'm going through a tutorial series at webmonkey. Here is the lesson I am currently working on: http://www.webmonkey.com/2010/02/JavaScript_Tutorial_-_Lesson_3/#Getting_Framed At the bottom of the page they give you a homework assignment which is to re-create this page using html and javascript. This page has 2 row frames. I re-created these frames and the top frame initially has a page called "navigation" loaded and the bottom page initially has a page called "explorer" loaded. If you click the monkey image at the right in the "navigation" frame, it opens a new page called "brand" in the bottom frame. This "brand" page has the same monkey image as the "navigation" page but unlike the other monkey image, this one changes when you mouseover it. If you mouseover it again, it changes to another image, and a third mouseover brings you back to the original monkey image. If you click on one of the images, it swaps the monkey image in the "navigation" frame with that image. The idea is that you have 3 images to chose from in the "brand" page that you can designate as the logo in the "navigation" page. I have no problem re-creating this effect. Here is the code I used to re-create this: I initialized these variables in the <head> of my page: Code: <script language="JavaScript"> var temp = ""; var img1 = 'http://www.wired.com/wired/webmonkey/stuff/javascript_tutorial_files/JST_homework3_files/brand_me_files/monkey.gif'; var img2 = 'http://www.wired.com/wired/webmonkey/stuff/javascript_tutorial_files/JST_homework3_files/brand_me_files/thau.gif'; var img3 = 'http://www.wired.com/wired/webmonkey/stuff/javascript_tutorial_files/JST_homework3_files/brand_me_files/sky.gif'; </script> Then I wrote this in the body of my page: Code: <a onclick="parent.navigation.document.logo.src=img1;" onmouseover=" temp=img1; img1=img2; img2=img3; img3=temp; document.the_image.src=img1;" href="#"> <img src="http://www.wired.com/wired/webmonkey/stuff/javascript_tutorial_files/JST_homework3_files/brand_me_files/monkey.gif" name="the_image"></a> Out of curiosity, I switched the order of onmoseover and onclick so that onmouseover came first like this: Code: <a onmouseover=" temp=img1; img1=img2; img2=img3; img3=temp; document.the_image.src=img1;" onclick="parent.navigation.document.logo.src=img1;" href="#"> <img src="http://www.wired.com/wired/webmonkey/stuff/javascript_tutorial_files/JST_homework3_files/brand_me_files/monkey.gif" name="the_image"></a> The page still worked in Firefox, but when I viewed the source (using firebug), onclick was still first and then onmouseover. I deleted my history and refreshed the page and still onclick was coming up first when I viewed the source. Does Firefox have an auto-correct feature that is forcing onclick to be first? Is there an order when using event handlers? Does onclick always have to come before onmouseover? Also, this code worked in Firefox and Safari, but it did not work in Chrome. Both with onclick and onmouseover first, I was able to mouseover and rotate through the images in Chrome, but whenever I clicked on an image the image was not swapped in the "navigation" page. Why? The "navigation" page also has a green button and a yellow button that change the background of the bottom frame to their respective color when clicked using the bgColor property. This effect also works in Firefox and Safari, but not in Chrome. Why? Do I have a setting in Chrome activated that is preventing this or does Chrome not recognize this code? I know this was long-winded but I'm a beginner so don't go too hard on me! Thanks in advance! Hi I have a script that runs fine in FF, Chrome But in IE it does not work at all...(mouse over/mouseout) Would you please help me fix the problem... here is the code: Code: <script type="text/javascript">
var c=0;
var t;
var timer_is_on=0;
function timedCount()
{
document.getElementById('txt').value=c;
c=c+1;
t=setTimeout("timedCount()",1000);
}
window.onmouseout=doTimer;
function doTimer()
{
if (!timer_is_on)
{
timer_is_on=1;
timedCount();
}
}
function stopCount()
{
clearTimeout(t);
timer_is_on=0;
}
function descriptionKeyUp() {
if (timer === null) {
startTimer();
}
else {
clearTimeout(timestop);
}
timestop = setTimeout(stopTimer, 6000);
}
</script>
-----------------------
<form>
<textarea name="taskdesc" id="taskdesc" cols="45" rows="5"onmouseover="stopCount()" onkeyup="descriptionKeyUp()"></textarea>
<p>Time Spent on Other tasks:
<input type="text" name ="txt" id="txt" />
</p>
<p>Time Spent on Documenting:
<input type="input" name="seconds" id="timer" />
</form>
basically what it does is when user takes the mouse away from the form it counts the time...when user put the cursor in side the form...it stops counting...... 2 onmouseover conflict. i cant click menu1-jQuery. can someone help me out. 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>
<title>灰色CSS+Js实现的下拉菜单代码- www.webdm.cn</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="JavaScript" type="text/javascript">
function $(id){
return document.getElementById(id);
}
function menu_my(name,num) {
var my;
my = $(name);
if ( my.last == undefined ) {
my.last = 1;
}
var Menu = $("Menu" + name + my.last);
var Cont = $("Cont" + name + my.last);
Menu.className = "";
Cont.style.display = "none";
var Menu = $("Menu" + name + num);
var Cont = $("Cont" + name + num);
Menu.className = "selectd";
Cont.style.display = "block";
my.last = num;
}
</script>
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
</script>
<style type="text/css">
body{
text-align: center;
font-size:12px;
}
#popimg{
WIDTH:770px;
margin:0 auto;
text-align:center;
}
#popimg2{
WIDTH:770px;
margin:0 auto;
text-align:center;
z-index:-1;
}
ul {
padding: 0;
margin: 0;
list-style: none;
}
li {
position:relative;
float: left;
width: 110px;
}
li ul {
position:absolute;
display: none;
top: 20px;left:0;
}
li:hover ul, li.over ul {
display: block;
}
ul li a{
display:block;
font-size:12px;
border: 1px solid #ccc;
padding:3px;
margin-right:1px;
text-decoration: none;
color: #777;background:#eee;
}
ul li a:hover{
background-color:#f4f4f4;
}
#test{
clear:both;
background-color:#999999;
width:769px;
height:100px;
margin:0 auto;
}
.menu0307 {
OVERFLOW: hidden; ZOOM: 1; HEIGHT: 28px
}
.menu0307 SPAN {
BACKGROUND: url(http://upload.ouliu.net/g/ad2da94515010b2c275a9b4958441e20.png) no-repeat -1000px 0px; FLOAT: left; OVERFLOW: hidden; WIDTH: 125px; LINE-HEIGHT: 300px; HEIGHT: 28px
}
.menu0307 SPAN#Menuxuehua1 {
BACKGROUND-POSITION: 0px 0px
}
.menu0307 SPAN#Menuxuehua2 {
BACKGROUND-POSITION: -125px 0px; WIDTH: 124px
}
.menu0307 SPAN.selectd#Menuxuehua1 {
BACKGROUND-POSITION: 0px -32px
}
.menu0307 SPAN.selectd#Menuxuehua2 {
BACKGROUND-POSITION: -125px -32px
}
</style>
</head>
<body>
<div id="popimg">
<ul id="nav">
<li><a href="">menu1</a>
<ul>
<li><a href="/">Ajax/JavaScript</a></li><li><a href="/">ExtJS</a></li><li><a href="/">jQuery</a></li>
</ul>
</li>
<li><a href="">menu2</a>
<ul>
<li><a href="/">test1</a></li><li><a href="/">test2</a></li><li><a href="/">test3</a></li>
</ul>
</li>
<li><a href="">Ajax</a>
<ul>
<li><a href="/">CSS</a></li><li><a href="/">HTML</a></li><li><a href="/">editor</a></li>
</ul>
</li>
<li><a href="">menu3</a>
<ul>
<li><a href="/">media</a></li><li><a href="/">object</a></li><li><a href="/">graphic</a></li>
</ul>
</li>
<li><a href="">menu4</a>
<ul>
<li><a href="/">Ajax/JavaScript</a></li><li><a href="/">ExtJS</a></li><li><a href="/">jQuery</a></li>
</ul>
</li>
<li><a href="">menu5</a>
<ul>
<li><a href="/">game</a></li><li><a href="/">programming</a></li><li><a href="/">sale</a></li>
</ul>
</li>
<li><a href="">VC++</a>
<ul><li><a href="/">database</a></li><li><a href="/">oracle</a></li><li><a href="/">sql</a></li>
</ul>
</li>
</ul>
</div>
<div id="popimg2">
<div id="test">
<DIV class=menu0307 id=xuehua>
<SPAN class=selectd id=Menuxuehua1 onmouseover="menu_my('xuehua',1)" ;>meeting</SPAN>
<SPAN id=Menuxuehua2 onmouseover="menu_my('xuehua',2)" ;>note</SPAN>
</DIV>
<DIV id=Contxuehua1 style="POSITION: relative">test</DIV>
<DIV id=Contxuehua2 style="DISPLAY: none">database</DIV>
</div>
</div>
</body>
</html>
this is my script Quote: <a href="javascript:void(0);" onmouseOver="hahaha()"> <img border="0" src="pink.gif" name="Mainpic" id="image"></a> and this is the function Quote: function hahaha() { document.getElementById('image').src="blue.gif"; } the problem is when i mouseover the image look like this why is that? help please! thanks http://www.primedesigning.com/ellis/ I'm working on a site for a friend and I can't figure out what's causing this blinking! Hover over one of the 3 pictures in the "Products" section to see what I'm talking about (the larger, expanded picture and its border blinks on and off). BTW, this site is still under construction. Any design ideas you guys may have would be appreciated too Thanks for any help! Heyho. Well I'm rather new to JavaScripting, so don't be harsh on me . Well I'm trying to make a 'onMouseOver & onMouseOut' event, where you hold the cursor over a image, it will change to another. So, here is my code: Code: <A HREF="Home.html" onmouseover="document.but.src='HOME_OVER.PNG'" onmouseout="document.but.src='HOME_BASE.PNG'"> <IMG SRC="Home_BASE.PNG" NAME="but" BORDER="0" ALT="..."> </A> <br> <A HREF="http://city-driving.co.uk" onmouseover="document.but.src='FORUM_OVER.PNG'" onmouseout="document.but.src='FORUM_BASE.PNG'"> <br> <IMG SRC="FORUM_BASE.PNG" NAME="but2" BORDER="0" ALT="..."> </A> It works fine when I use it for 1 picture, but it really mess up when I use it more then 1 time :/. I don't understand why. Probably obvious for you! Looking forward to (hopefully) see a solution . Marius. Hey everyone, I'm trying to make a sound by using the mouseover event on JS. The script works fine on my husband's computer (IE8, windows xp), but does not work on mine (IE8, Vista). Click on the link below to give you an idea. Just mouseover the images and you should hear an elephant and duck sound. Mouseover the word "elephant" and it "should" make an elephant sound. http://www.mypreciousarrival.com/Ani...oundtest4.html I just need to find a script that will work with different operating systems (or at least windows xp and vista) and browsers (or at least IE) Any suggestions are greatly appreciated. I would like to not resort to any macromedia or schockwave scripting. Thank you! So i've written abit of code myself in order to do this: I will have multiple video tags on my website, each of the video tag's will have to be able to play/pause seperatly, so technically speaking only 1 video should be playing at a time, when the user 'onmouseout' it should pause and when the user's gos to another video that other video should start playing. If he move's the cursor out of the video it should stop... The problem is now, i have video A & B. When i go 'onmouseover' video B, video A starts playing. This is how i started coding: 1 . 2 functions for playing/pausing a video tag 2 . Check how many <video> tags are on the page (after load) 3 . Add Event "mouseout" + function to each <video> tag And the actual code: Javascript: Code: /*** FUNCTIONS OM DE MOUSEOVER & OUT TE DOEN WERKEN ***/
function speelFilmpje(){
document.getElementById("filmpke").play();
}
function stopFilmpje(){
document.getElementById("filmpke").pause();
}
window.onload = function(){
/*** FUNCTION DIE ONMOUSEOVER & OUT FUNCTIE AAN 'VIDEO' TAGS TOEVOEGT ***/
var video = document.getElementsByTagName('video');
var videotags = video.length;
//console.log(videotags);
for(i=0; i<videotags;i++){
video[i].addEventListener("mouseover", speelFilmpje,false);
video[i].addEventListener("mouseout", stopFilmpje,false);
}//einde van de functie
}
HTML: Code: <div id="right_column">
<div id="preview1">
<video width="197" height="81" id="filmpke">
<source src="unknown.ogg" type="video/ogg">
<source src="unknown.mp4" type="video/mp4">
</video>
<a href="#">Unknown (2010)</a>
</div>
<div id="preview1">
<video width="197" height="81" id="filmpke">
<source src="unknown.ogg" type="video/ogg">
<source src="unknown.mp4" type="video/mp4">
</video>
<a href="#">Unknown (2010)</a>
</div>
</div>
Any thoughts or information is welcome. I've stumbled upon my own wall of "Lack of knowledge" -_- So I have been struggling with a Javascript issues for a couple of days now and can't find an answer anywhere online that has helped. I have a javascript loop that is looping through all of my <dfn> html tags. These tags are used to show a glossary term on my page. When the user mouses over the term it shows a popup with the term name and the definition. Here is my javascript function: Code: function definitionRollover(){
var j;
var dfns = document.getElementsByTagName('dfn')
for (j=0; j<dfns.length;j++){
var term = dfns[j].innerHTML.charAt(0).toUpperCase() + dfns[j].innerHTML.slice(1);
var definitionArray = new Array(term, dfns[j].title);
dfns[j].onmouseover = function(){stm(definitionArray,Style[0])}
dfns[j].onmouseout = function(){htm();};
}
}
As you can see I am adding a onmouseover event to these <dfn> tags which calls another function (stm) with the definition and term being held in the definitionArray. This works great until I have multiple terms on a page. When I have multiple terms it only shows the last terms definition for all terms. My question is how I can get it to work for all terms. I know that throughout the loop the definitionArray is holding the correct info at the correct time but for some reason it only shows the last one. I hope that this makes sense and if anyone could give me any tips or leads it would be very much appreciated. Here is a javascript/html code that changes a text phrase to something else on mouseover but it doesn't return to its original state before the event happened. The code is below. Thank you for your help. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script></script>
<title>Javascript</title>
<style type="text/css">
div
{
font-family: Georgia
}
</style>
</head>
<body>
<script type="text/javascript">
function changetext()
{
var textchange2 = "~Home~" ;
var id = document.getElementById("A");
id.innerHTML=textchange2;
}
</script>
<div id="A" onmouseover="changetext();">Home</div>
</body>
</html>
Hi, Im a complete newbie to javascript and I've basically copied and pasted the javascript I found here to use on my site. Its an onMouseOver slideshow: http://www.javascriptkit.com/script/...ifferent.shtml to use on my site. Basically, my problem is how do I add a second, separate image in a different location on the web page, associated with this script? If I post <a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a> in two different locations, which is the script for the image, the script stops working, but having it once makes it work. So how do I add two different image locations? Can someone please help me here? I just want to add more images in a different location. ie have image location 1, and image location 2. Thanks in advance Script Below: Code: <script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink1
}
</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
preloadimages(my images here)
</script>
For the Links:
<a href="creativewriting.html" onMouseover="changeimage(myimages[1],this.href)">Creative Writing</a><br>
For the Image:
<a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a>
hi, please ignore this thread..it is a duplicate of one already active. MODS please delete. apologies for my mistake. PHP Code: var deck = new Array (52); for (var ind = 0, face = 1; ind < 52; ind+=4, face++) { deck[ind] = face + "c"; deck[ind + 1] = face + "d"; deck[ind + 2] = face + "h"; deck[ind + 3] = face + "s"; } for (var a = 0, b = 0, c = 0; a < 19; a++, b+=2) { document.write("<img src='cards/placeholder.gif' name='" + deck[b] + "' width='53' height='68' onClick='alert(" + deck[b] + ")'>"); } I have this code for my Go Fish game, however it will not show an alert when you click the image. I've also tried onClick='alert(deck[" + b + "])' but that does not work either. Can someone help me please? Hello Everyone! I have one link that I need to do two onclick events at once. At first I just tried writing them both but that obviously didn't work b/c I'm here! This would result in the first onclick event tacking place and not the second. So my question is could someone tell me how to write this code in javascript, so both events will take plack onclick, and then how I should reference that script within my link? Thank you for taking a look Code: <a href = "javascript:void(0)"
onclick = "document.getElementById('light<?php echo $count;?>').style.display='none';document.getElementById('fade<?php echo $count;?>').style.display='none'"
onclick = "document.getElementById('light<?php echo $count + 1;?>').style.display='block';document.getElementById('fade<?php echo $count + 1;?>').style.display='block'"> Previous
</a>
I guess it is because it is 2am and had a few beers but i cannot get this to work and i know its pretty simple to do - see the code below: Code: {if ""|fn_needs_image_verification == true}
{assign var="is" value="Image_verification"|fn_get_settings}
<p{if $align} class="{$align}"{/if}>{$lang.image_verification_body}</p>
{assign var="id_uniqid" value=$id|uniqid}
{literal}
<script language="javascript" type="text/javascript">
function reloadCaptcha() {
captcha = document.getElementById("captureURLID").src;
return captcha += 'reload';
}
</script>
{/literal}
{if $sidebox}
<p><img id="verification_image_{$id}" class="image-captcha valign" src="{"image.captcha?verification_id=`$SESS_ID`:`$id`&`$id_uniqid`&"|fn_url:'C':'rel':'&'}" alt="" onclick="this.src += 'reload' ;" width="{$is.width}" height="{$is.height}" /></p>
{/if}
<p><input class="captcha-input-text valign" type="text" name="verification_answer" value= "" autocomplete="off" />
{if !$sidebox}
<img id="verification_image_{$id} captureURLID" class="image-captcha valign" src="{"image.captcha?verification_id=`$SESS_ID`:`$id`&`$id_uniqid`&"|fn_url:'C':'rel':'&'}" alt="" onclick="this.src += 'reload' ;" width="{$is.width}" height="{$is.height}" />
{/if}
<img src="{$images_dir}/icons/icon_reload.png" height="25" width="25" alt="Reload Captcha Image" onclick="reloadCaptcha();" class="valign image-captcha" /></p>
{/if}
now the following works totally fine, when you click the captcha code changes..... "onclick="this.src += 'reload'" you will notice i have added a custom reload button image below this with a onclick calling a custom function "reloadCaptcha(); which i want to reload the captcha image above it - however it is not working, i have done the function so it grabs the src from the element ID, i have added 2 ID's to the IMG but cannot remember if you can have multiple IDs or not which if not could be causing the problem but not 100% sure how to include the smarty code for the generated ID on that image. Any ideas on the code above from having a quick glimps? as the code stands i get the error: Error: captureURL is null Many Thanks I finished this code, the full code is not here, but when I ran it as a diagnostic the action did not occur when i clicked on the "process item" button. I believe it may have something to do with the script, but i am new to javascript and cannot seem to figure it out, it is supposed to multiply the price by the number to give the value of sale (sale). Any help would be much appreciated!!! Code: <html>
<script language="javascript">
function test()
{
var Items,Price,Number,sale;
Items = parselfloat(document.victoria.secondnumber.value);
Price = parselfloat(document.victoria.price.value);
Number = parselfloat(document.victoria.num.value);
sale = Price*Number;
document.victoria.val.value=sale;
}
</script>
<body><form name ="victoria">
<center>
<table border=40 bordercolor="yellow">
<tr><td>Customer Number <input name ="firstnumber" type="text" size="6" value="1" ></td>
<td>Home Delivery <input name="customer_name" type="checkbox"Checked></td><tr>
<tr><td>Items Purchased</td><td><center><input name="secondnumber" type="text" size="12"></center></td></tr>
<tr><td>Item Number</td><td><center><input name="itemnum" type="text" size="12" value="1"></center></td></tr>
<tr><td>Price</td><td><center><input name="price" type="text" size="12"></center></td></tr>
<tr><td>Number Purchased</td><td><center><input name="num" type="text" size="12"></center></td></tr>
<tr><td>Value of Sale</td><td><center><input name="val" type="text" size="12" value="0"></center></td></tr>
<tr><td>Customer Total</td><td><center><input name="total" type="text" size="12" value="0"></center></td></tr>
<tr><td></td><td><input type="button" value="Process Item" onclick="test()"></td></tr>
</table>
</center></form>
</body></html>
I've been doing some research as to why this doesn't work but to no avail. I'm hoping someone here can lend a hand/brain. I'm relatively new to Javascript. This works perfectly in FF and IE7 but not IE6. The very last "tdright" div at the bottom of this list (the item shown in the HTML I've provided is in the middle of 30+ rows of parameters) also gets out of whack in IE6 for some reason. FF is fine, of course. Code: var ie = (document.all) ? true : false;
function hideID(objID){
var element = (ie) ? document.all(objID) : document.getElementById(objID);
element.style.display="none"
}
function showID(objID){
var element = (ie) ? document.all(objID) : document.getElementById(objID);
element.style.display="block"
}
function toggleID(objID){
var element = (ie) ? document.all(objID) : document.getElementById(objID);
if (element.style.display=="none"){
element.style.display="block"
}
else {
element.style.display="none"
}
}
Code: <div class="tdright">: <input type="text" size="1" name="x_label_angle" value="<?php echo $_SESSION['x_label_angle']; ?>"></div>
<div class="tdleft"><p class="IEtop4px">Interval</p></div>
<div class="tdright">:
<select name="x_label_interval" style="width:80px">
<option value="First & Last" onClick="hideID('x_label_other_left');hideID('x_label_other_right');"<?php if ($_SESSION['x_label_interval'] == "First & Last") { ?> selected<?php } ?>>First & Last
<option value="Halfway" onClick="hideID('x_label_other_left');hideID('x_label_other_right');"<?php if ($_SESSION['x_label_interval'] == "Halfway") { ?> selected<?php } ?>>Halfway
<option value="One-Third" onClick="hideID('x_label_other_left');hideID('x_label_other_right');"<?php if ($_SESSION['x_label_interval'] == "One-Third") { ?> selected<?php } ?>>One-Third
<option value="All" onClick="hideID('x_label_other_left');hideID('x_label_other_right');"<?php if ($_SESSION['x_label_interval'] == "All") { ?> selected<?php } ?>>All
<option value="Other" onClick="showID('x_label_other_left');showID('x_label_other_right');"<?php if ($_SESSION['x_label_interval'] == "Other") { ?> selected<?php } ?>>Other
</select>
</div>
<div class="tdleft" id="x_label_other_left" style="display:none"></div>
<div class="tdright" id="x_label_other_right" style="display:none"> <input type="text" size="1" name="x_label_other_interval" value="<?php if (is_numeric($_SESSION['x_label_interval'])) { echo $_SESSION['x_label_interval']; } ?>"></div>
Thanks in advance! |
|||||||