|
JavaScript - Changing Class On Hover And Keeping It
Hi guy not the greatest with javascript i use it now and then.
so far i have this code working correctly. Currently on mouse-over its changes the img background of imgholder. this is the HTML Code: <div id="imgholder">
</div>
<div id="myController2">
<span class="jFlowControl2">No 1 </span>
<span class="jFlowControl2">No 2 </span>
</div>
<div id="mySlides2">
<div>
<a onmouseover="changeImg(this, 'img2.jpg');" class="vm" href="vulnerabiliy.htm" title="Vulnerability Management"></a>
<a onmouseover="changeImg(this, 'img3.jpg');" class="grc" href="it_grc.htm" title="IT Governance, Risk and Compliance"></a>
<a onmouseover="changeImg(this, 'img4.jpg');" class="pci" href="pci.htm" title="Payment Card Industry Data Security Standard"></a>
<a onmouseover="changeImg(this, 'img5.jpg');" class="gcs" href="gcs.htm" title="Government Connect Code of Connection"></a>
<a onmouseover="changeImg(this, 'img1.jpg');" class="pt" href="penetration.htm" title="Penetration Testing"> </a>
<a onmouseover="changeImg(this, 'img6.jpg');" class="as" href="application.htm" title="Application Security"> </a>
<!--span class="jFlowNext2 NextFlash"> </span-->
</div>
<div>
<!--span class="jFlowPrev2 BackFlash"> </span-->
</div>
</div>
</div>
This is the script Code: <script language="javascript" type="text/javascript" src="inc/js/changeImg.js"></script>
function changeImg(e, imgName)
{
URL_prefix = 'http://www.website.co.uk/surecloud';
// set image url
image_url = new Array();
image_url[0] = URL_prefix+"/images/img1.jpg";
image_url[1] = URL_prefix+"/images/img2.jpg";
image_url[2] = URL_prefix+"/images/img3.jpg";
image_url[3] = URL_prefix+"/images/img4.jpg";
image_url[4] = URL_prefix+"/images/img5.jpg";
image_url[5] = URL_prefix+"/images/img6.jpg";
preload_image_object = new Array();
for(var i = 0; i < image_url.length; i++)
{
preload_image_object[i] = new Image();
preload_image_object[i].src = image_url[i];
}
document.getElementById('imgholder') .style.background="transparent url('images/" + imgName + "') no-repeat";
}
currenly if you hover over any of the <a> a css class is applied css code Code: #flash a.grc:hover {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(../../images/animated_nav.gif) no-repeat scroll -148px -59px;
}
what i need to do is keep this class applied over the last <a> that is hovered. so what i would like to do is change the class of the last <a> hover so it stays active until another one is hovered. does this make sense? any help or guidance would be appreciated Similar TutorialsOkay, I have this code, Code: <script type="text/javascript">
function changeText2(){
var userInput = document.getElementById('userInput').value;
document.getElementById('boldStuff2').innerHTML = userInput;
}
</script>
<p>Welcome to the site <b id='boldStuff2'>dude</b> </p>
<input type='text' id='userInput' value='Enter Text Here' />
<input type='button' onclick='changeText2()' value='Change Text'/>
A fairly simple one, and it is great, but I want to change it so that the text you type in stays there! Forever! For example, a person visits the site and types in "Hello" then the option of changing the text again disappears, and every visitor after that sees "Hello" (or whatever the first person types). Is this possible? Can anyone help me out! Hey guys, So I have a top navigation bar with links in it and when I hoover over a link I want the navigation bars background image to change. The links are actually Images with an <a href=""></a> tag around them. The site isn't live so I can't give you a link. Here is the code: HTML ( I want the id="Nav" background to change when I hover over the "Home" "Forums" "Downloads" "Contact" Images ) Code: <div id="Nav"> <div id="Splitters" class="clearfix"> <div id="group1"> <img id="Layer_3_copy" src="images/Layer_3_copy.png" alt="" width="2" height="65" /> </div> <div id="group2"> <img id="Layer_3_copy_3" src="images/Layer_3_copy.png" alt="" width="2" height="65" /> </div> <div id="group3"> <img id="Layer_3_copy_4" src="images/Layer_3_copy_3.png" alt="" width="2" height="67" /> </div> </div> <div id="Nav_Text" class="clearfix"> <a href="#"> <img id="Home" src="images/Home.png" alt="" width="48" height="11" /> </a> <a href="#"> <img id="Forums" src="images/Forums.png" alt="" width="71" height="11" /> </a> <a href="#"> <img id="Downloads" src="images/Downloads.png" alt="" width="109" height="11" /> </a> <a href="#"> <img id="Contact" src="images/Contact.png" alt="" width="80" height="11" /> </a> </div> </div> CSS Code: #Nav {
background: url(images/Main.png) no-repeat;
left: 0;
min-height: 70px;
position: absolute;
top: 0;
width: 100%;
}
#Splitters {
left: 421px;
position: absolute;
top: 0;
width: 334px;
}
#group1 {
display: inline;
float: left;
margin: 0 0 0 107px;
width: 2px;
}
#Layer_3_copy {
clear: both;
float: left;
margin: 0;
width: 2px;
}
#group2 {
float: left;
margin: 0 0 0 95px;
width: 2px;
}
#Layer_3_copy_3 {
clear: both;
float: left;
margin: 0;
width: 2px;
}
#group3 {
float: right;
margin: 0;
width: 2px;
}
#Layer_3_copy_4 {
clear: both;
float: left;
margin: 0;
width: 2px;
}
#Nav_Text {
left: 449px;
position: absolute;
top: 29px;
width: 397px;
}
Here is the link: http://sovietgaming.com/misc.php?page=roster We have a roster for Starcraft 2 and when you hover over one of the pictures it displays more info however if you start to scroll and hover you can no longer see it. We need to make so that you can see the hover over no matter where you are on the page. I'm pretty sure the problem is in style #10 of the js code posted below. Code: /* Please refer to readme.html for full Instructions Text[...]=[title,text] Style[...]=[TitleColor,TextColor,TitleBgColor,TextBgColor,TitleBgImag,TextBgImag,TitleTextAlign,TextTextAlign, TitleFontFace, TextFontFace, TipPosition, StickyStyle, TitleFontSize, TextFontSize, Width, Height, BorderSize, PadTextArea, CoordinateX , CoordinateY, TransitionNumber, TransitionDuration, TransparencyLevel ,ShadowType, ShadowColor] */ var FiltersEnabled = 1 // if your not going to use transitions or filters in any of the tips set this to 0 Text[0]=["Forum Username: Soviet_Nova","<li>Best Race: Zerg</li><li>League: Silver</li> <li>Times Online: Afternoons/late night</li> <li>Favorite Custom map: Nexus Wars, Gem TD, Squadron TD, any other T or D really </li> <li>Location: Ft. Collins, Colorado</li>"] Text[1]=["Forum Username: Figgy13","<li>Best Race: Zerg</li><li>League: Gold</li> <li>Times Online: Whenever possible (Wednesday's dedicated to SC2)</li> <li>Favorite custom map: SOTIOS and Risk</li> <li>Location: New Jersey</li>"] Text[2]=["Forum Username: Soviet-Mario","<li>Offrace: meh, i like to offrace as both, but i suppose my toss is better</li><li>Location: New Orleans Louisiana</li> <li>Favorite Gear: Razer Deathadder mouse, banshee headset, marauder keyboard</li> <li>SC1 AKA: Soviet_Mario</li>"] Text[3]=["Forum Username: Cheapliquid","<li>Best Race: Random</li><li>League: Gold</li> <li>Times Online: Randomly all day</li> <li>Favorite Custom map: GEM D</li> <li>Location: The Dirty Jersey</li>"] Text[4]=["Forum Username: Trooper","<li>Best Race: Terran</li><li>League: Master</li> <li>Times Online: Almost every night</li> <li>Favorite Custom map: Nexus Wars</li> <li>Location: Pennsylvania</li>"] Text[5]=["Forum Username: Soviet_Smoke","<li>Best Race: Unknown</li><li>League: Unkown</li> <li>Times Online: Unkown</li> <li>Favorite Custom map: Unkown</li> <li>Location: Unknown</li>"] Text[6]=["Forum Username: MAXPOWER","<li>Best Race: Unknown</li><li>League: Practice</li> <li>Times Online: Never</li> <li>Favorite Custom map: Unknown</li> <li>Location: Southern Colorado</li>"] Text[7]=["Forum Username: Oreo","<li>Best Race: Protoss</li><li>League: High Masters -peaked top 1000's NA</li> <li>Times Online: 3-5, 8-10 weekedays and weekends varies</li> <li>Favorite Custom map: Marine Arena or a MOBA</li> <li>Location: Massachusetts</li>"] Text[8]=["Forum Username: Soviet-cbel","<li>Offrace: Both of my offraces suck, unfortunately</li><li>Stream: None</li> <li>Location: NC</li> <li>Favorite Gear: Logitech/Razer</li> <li>SC1 AKA: None</li>"] Text[9]=["Forum Username: Frosty","<li>Best Race: Random</li><li>League: Diamond</li> <li>Times Online: Medium Activity</li> <li>Favorite Custom map: Squadron/hero attack/zealot frenzy</li> <li>Location: Edmonton, Alberta, Canada</li>"] Text[10]=["Forum Username: Wartourist","<li>Best Race: Terran</li><li>League: Diamond</li> <li>Times Online: Mostly week nights</li> <li>Favorite Custom map: Mafia</li> <li>Location: Montreal, Canada</li>"] Text[11]=["Forum Username: Soviet_Nova","<li>Best Race: Zerg</li><li>League: Silver</li> <li>Times Online: Afternoons/late night</li> <li>Favorite Custom map: Nexus Wars, Gem TD, Squadron TD, any other T or D really </li> <li>Location: Ft. Collins, Colorado</li>"] Text[12]=["Forum Username: Soviet_Hegemon","<li>Best Race: Terran</li><li>League: Silver/Scrub</li> <li>Times Online: Sporadically</li> <li>Favorite Custom map: BattleCraft and Desert Strike</li> <li>Location: Everett,WA</li>"] Text[13]=["Forum Username: Acid","<li>Off Race: Zerg</li> <li>Stream: twitch.tv/sGAcid </li> <li>Location: Upstate New York</li> <li>Favorite Gear: Logitech</li> <li>Location: Upstate New York</li> <li>SC1 AKA: Soviet_Acid</li>"] Text[14]=["Forum Username: Hauskta","<li>Offrace: Terran</li> <li>Stream: http://www.twitch.tv/haustka</li> <li>Location: Tucson, Arizona</li> <li>Favorite Gear: Logitech</li> <li>SC1 AKA: Soviet_Haustka</li>"] Text[15]=["Forum Username: Soviet_Greywolf","<li>Offrace: None</li><li>Stream: None</li> <li>Location: Everett, WA</li> <li>Favorite Gear: Logitech</li> <li>SC1 AKA: Soviet_Greywolf</li>"] Text[16]=["Forum Username: Soviet_Nova","<li>Best Race: Zerg</li><li>League: Silver</li> <li>Times Online: Afternoons/late night</li> <li>Favorite Custom map: Nexus Wars, Gem TD, Squadron TD, any other T or D really </li> <li>Location: Ft. Collins, Colorado</li>"] Text[17]=["Forum Username: MAXPOWER","<li>Best Race: Unknown</li><li>League: Practice</li> <li>Times Online: Never</li> <li>Favorite Custom map: Unknown</li> <li>Location: Southern Colorado</li>"] Text[18]=["Forum Username: Maesy","<li>Best Race: Random</li><li>League: Diamond</li> <li>Times Online: Scattered depending on work schedule</li> <li>Favorite Custom map: Gem TD/Desert Strike equally.</li> <li>Location: Florida</li>"] Text[19]=["Forum Username: PeaceSC2","<li>Best Race: Terran</li><li>League: Masters</li> <li>Times Online: Depends on the day</li> <li>Favorite Custom map: no idea</li> <li>Location: Vancouver BC, Canada</li>"] Text[20]=["Forum Username: Link uK","<li>Best Race: Zerg</li><li>League: Diamond</li> <li>Times Online: Any other day but Wed.</li> <li>Favorite Custom map: Any map made by Darglein or Multitasking trainer.</li> <li>Location:Don't Be a Creep Bro</li>"] Text[21]=["Forum Username: Kenjiman","<li>Best Race: Zerg</li><li>League: Diamond</li> <li>Times Online: Whenever i dont have homework or midterms/finals.</li> <li>Favorite Custom map: Don't really have one..</li> <li>Location: Cal Poly San Luis Obispo</li>"] Text[22]=["Forum Username: DCE_Mason","<li>Best Race: Zerg</li><li>League: Platinum</li> <li>Times Online:After school (4pm-10pm CST)</li> <li>Favorite Custom map: 1v1 Obs Metalopolis Slime</li> <li>Location: Chicago, IL</li>"] Text[23]=["Forum Username: MicroSyntax","<li>Offrace: No! There is no Offrace, there is only one race and it has machineguns and women with long legs. </li><li>Stream: under construction</li> <li>Location: Canoobian</li> <li>Favorite Gear: If it moves or clicks, I like it. </li> <li>SC1 AKA: None</li>"] Text[24]=["Forum Username: TeamSnorlax","<li>Best Race: Protoss</li><li>League: Platinum</li> <li>Times Online: Afternoon / Evening Central</li> <li>Favorite Custom map: N/A</li> <li>Location: Chicago, IL, USA/li>"] Text[25]=["Forum Username: SniperRome","<li>Best Race: Protoss (Random)</li><li>League: High Masters</li> <li>Times Online: Random</li> <li>Favorite Custom map: Starjeweled, Diplomacy</li> <li>Location: Alberta, Canada</li>"] Text[26]=["Forum Username: Swordy","<li>Best Race: Zerg</li><li>League: Diamond</li> <li>Times Online: Frequently</li> <li>Favorite Custom map: MageCraft + RMC</li> <li>Location: Devon, United Kingdom</li>"] Text[27]=["Forum Username: fox","<li>Best Race: Terran</li><li>League: High Masters</li> <li>Times Online: All the time</li> <li>Favorite Custom map: None</li> <li>Location: USA</li>"] Text[28]=["Forum Username: CivilAnarchy","<li>Best Race: Zerg</li><li>League: Master</li> <li>Times Online: Highly active but varied times</li> <li>Favorite Custom map: Phantom Mode</li> <li>Location: Voorhees New Jersey</li>"] Text[29]=["Forum Username: nobodyWondeR","<li>Best Race: Terran</li><li>League: Master</li> <li>Times Online: weekdays 3-5:30pm PST</li> <li>Favorite Custom map: metalopolis, shattered, antiga</li> <li>Location: California</li>"] Text[30]=["Forum Username: steveyy153","<li>Best Race: Protoss</li><li>League: Master</li> <li>Times Online: Weekends and whenever else I have time</li> <li>Favorite Custom map: Civ Sapphire</li> <li>Location: Bloomington, Indiana</li>"] Text[31]=["Forum Username: Nemesis","<li>Best Race: Protoss</li><li>League: Master</li> <li>Times Online: Whenever I can, usually mid evning to early morning</li> <li>Favorite Custom map: None</li> <li>Location: Nova Scotia, Canada</li>"] Text[32]=["Forum Username: Lane_","<li>Best Race: Zerg</li><li>League: Diamond</li> <li>Times Online: Always</li> <li>Favorite Custom map: Star Battle, Risk</li> <li>Location: USAr</li>"] Text[33]=["Forum Username: Defrath","<li>Best Race: Protosss</li><li>League: Diamond</li> <li>Times Online: After 5</li> <li>Favorite Custom map: BW Fall of the Dark Lord, or BW Bunker Wars.e</li> <li>Location: Schenectady, New York.</li>"] Text[34]=["Forum Username: ExO","<li>Best Race: Protoss</li><li>League: Master</li> <li>Times Online: N/A</li> <li>Favorite Custom map: N/A </li> <li>Location: Houston, Texas </li>"] Text[35]=["Forum Username: Haro","<li>Stream: None</li><li>Offrace: Zerg None</li> <li>Location: New York City</li> <li>Favorite Gear: None</li> <li>Sc1 AKA: None</li>"] Text[36]=["Forum Username: ZimZam","<li>Stream: None</li><li>Offrace: Zerg</li> <li>Location: Portland, Oregon</li> <li>Favorite Gear: Rapoo </li> <li>Sc1 AKA: Zimri</li>"] Text[37]=["Forum Username: Voodoo","<li>Stream: None</li><li>Offrace: Was top Dia z, currently playing as low Dia p </li> <li>Location: Tornot, Ontario, Canada </li> <li>Favorite Gear: I use a laptop and a logitech g9x dontlaughatme</li> <li>Sc1 AKA: None</li>"] Text[38]=["Forum Username: daSnake","<li>Stream: None</li><li>Offrace: Toss is all I know</li> <li>Location: what is this? AOL? FL</li> <li>Favorite Gear: Razer all the way</li> <li>Sc1 AKA: Soviet_da5nake good times... I have another one but can't remember</li>"] Text[39]=["Forum Username: SuzumiyauK","<li>Stream: None</li><li>Offrace: None</li> <li>Location: Toronto, Ontario</li> <li>Favorite Gear: Headphone: Bose Mouse: Steelseries Keyboard: Logitech </li> <li>Sc1 AKA: SuzumiyauK, GeneraluK, Mystic_Raptor, FoW_Raptor, NoVa</li>"] Text[40]=["Forum Username: SlamDuncan","<li>Stream: SlamDuncan64 on twitchtv</li><li>Offrace: I play random lol</li> <li>Location: Canada</li> <li>Favorite Gear: Steeleseries and Razer mix</li> <li>Sc1 AKA: None</li>"] Text[41]=["Forum Username: Drpoppler","<li>Stream: justin.tv/drpoppler</li><li>Offrace: Protoss</li> <li>Location: Canada eh?</li> <li>Favorite Gear: Logitech</li> <li>Sc1 AKA: None</li>"] Text[42]=["Forum Username: Crevasse","<li>Stream: None</li><li>Offrace: Protoss</li> <li>Location: CA</li> <li>Favorite Gear: Filco, Steelseries</li> <li>Sc1 AKA: None</li>"] Text[43]=["Forum Username: Dystopian","<li>Stream: http://www.teamliquid.net/video/streams/Dystopian</li><li>Offrace: Terran</li> <li>Location: Arizona</li> <li>Favorite Gear: Logitech</li> <li>Sc1 AKA: None</li>"] Text[44]=["Forum Username: sGstorm","<li>Stream: twitch.tv/jgreen46</li><li>Offrace: Protoss like a boss</li> <li>Location: Vancouver, Canada</li> <li>Favorite Gear: Sentinel Zero-G Mouse. Changeable mouse weight? YES PLZ.</li> <li>Sc1 AKA: hizzlemafizzle, fox not sGFox</li>"] Text[45]=["Forum Username: eFeKZ","<li>Stream: http://www.twitch.tv/eFeKZ</li><li>Offrace: Zerg Top8Masters</li> <li>Location: Currently Costa Rica (Soon Canada again)</li> <li>Favorite Gear: Razer / Steel Series</li> <li>Sc1 AKA: fLow</li>"] Text[46]=["Forum Username: AceGeneral","<li>Stream: None</li><li>Offrace: Oh God No!</li> <li>Location: Corn State of Indiana</li> <li>Favorite Gear: LOL what gear</li> <li>Sc1 AKA: Ace</li>"] Text[47]=["Forum Username: Defrath","<li>Best Race: Protosss</li><li>League: Diamond</li> <li>Times Online: After 5</li> <li>Favorite Custom map: BW Fall of the Dark Lord, or BW Bunker Wars.e</li> <li>Location: Schenectady, New York.</li>"] Text[48]=["Forum Username: Kaiser","<li>Stream: None</li><li>Offrace: I only play Zerg because I have self-respect</li> <li>Location: British Columbia, Canada</li> <li>Favorite Gear: My trusty MX518.</li> <li>Sc1 AKA: None</li>"] Text[49]=["Forum Username: Comedian","<li>Stream: None</li><li>Offrace: all</li> <li>Location: Purdue University</li> <li>Favorite Gear: None</li> <li>Sc1 AKA: None</li>"] Text[50]=["Forum Username: Swordy","<li>Stream: None</li><li>Offrace: None</li> <li>Location: Devon, United Kingdom England</li> <li>Favorite Gear: Logitech</li> <li>Sc1 AKA: MyWifeForAiur, Soviet_Sword</li>"] Text[51]=["Forum Username: Blank","<li>Stream:</li><li>Offrace:</li> <li>Location: </li> <li>Favorite Gear: </li> <li>Sc1 AKA:</li>"] Text[52]=["Forum Username: MAXPOWER","<li>Best Race: Unknown</li><li>League: Practice</li> <li>Times Online: Never</li> <li>Favorite Custom map: Unknown</li> <li>Location: Southern Colorado</li>"] Text[53]=["Forum Username: Acid","<li>Off Race: Zerg</li> <li>Stream: twitch.tv/sGAcid </li> <li>Location: Upstate New York</li> <li>Favorite Gear: Logitech</li> <li>Location: Upstate New York</li> <li>SC1 AKA: Soviet_Acid</li>"] Text[54]=["Forum Username: Soviet-Mario","<li>Offrace: meh, i like to offrace as both, but i suppose my toss is better</li><li>Location: New Orleans Louisiana</li> <li>Favorite Gear: Razer Deathadder mouse, banshee headset, marauder keyboard</li> <li>SC1 AKA: Soviet_Mario</li>"] Style[0]=["white","black","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,10,10,51,1,0,"",""] Style[1]=["white","black","#000099","#E8E8FF","","","","","","","center","","","",200,"",2,2,10,10,"","","","",""] Style[2]=["white","black","#000099","#E8E8FF","","","","","","","left","","","",200,"",2,2,10,10,"","","","",""] Style[3]=["white","black","#000099","#E8E8FF","","","","","","","float","","","",200,"",2,2,10,10,"","","","",""] Style[4]=["white","black","#000099","#E8E8FF","","","","","","","fixed","","","",200,"",2,2,1,1,"","","","",""] Style[5]=["white","black","#000099","#E8E8FF","","","","","","","","sticky","","",200,"",2,2,10,10,"","","","",""] Style[6]=["white","black","#000099","#E8E8FF","","","","","","","","keep","","",200,"",2,2,10,10,"","","","",""] Style[7]=["white","black","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,40,10,"","","","",""] Style[8]=["white","black","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,10,50,"","","","",""] Style[9]=["white","black","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,10,10,51,0.5,75,"simple","gray"] Style[10]=["white","white","#2C2C2C","#2C2C2C","http://soviet.scdiplo.com/images/gamer/nav_sub.png","","center","left","Verdana","Verdana","center","",2,2,300,100,2,20,10,0,50,1,80,"complex","gray"] Style[11]=["white","white","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,10,10,51,0.5,45,"simple","gray"] Style[12]=["white","black","#000099","#E8E8FF","","","","","","","","","","",200,"",2,2,10,10,"","","","",""] applyCssFilter() What should be done to fix it? Thank you! Hey, I want javascript to change the background image on hover. This is my javascript: Code: function navOver(obj){
var imgUrl = 'url(images/' + obj.id + '.hover.png) center no-repeat';
obj.style.background='imgUrl';
}
function navOut(obj){
var imgUrl = 'url(images/' + obj.id + '.png) center no-repeat';
obj.style.background='imgUrl';
}
and this is the HTML: Code: <li id="home" onmouseover="navOver(this)" onmouseout="navOut(this)"></li> This doesn't work, can anyone help me and say me what to do? Hi everyone. I am unfortunately stuck, and must admit myself defeated by my inferior javascript knowledge. I would really love some sort of javascript observer to automatically add/remove a class to the labels on my page, depending on wether their checkboxes are checked or not. As well as adding those same CSS-classes to the checkboxes already checked on document load. This would be possible in javascript, wouldn't it? I'm trying to add a body class of 'day' if it's 6am-5pm and 'night' if it's 5pm-6am based on the user's local time. I tried the following but it didn't work. Any ideas? In the <head> Code: <script>
function setTimesStyles() {
var currentTime = new Date().getHours();
if(currentTime > 5 && currentTime < 17) {
document.body.className = 'day';
}
else {
document.body.className = 'night';
}
}
</script>
Code: <body onload="setTimeStyles();"> Also, is there a more elegant way to achieve what I need? Hello, I am new with Javascript and running into this problem that I don't understand. I define a base class that only contains an array "elements", and a derived class that contains nothing more (for simplicity): Code: function baseClass() {
this.elements = new Array;
}
function derivedClass() {
}
derivedClass.prototype = new baseClass;
Then I create two instances of the derived class, and add two elements in each: Code: a = new derivedClass();
a.elements.push("A");
a.elements.push("B");
b = new derivedClass();
b.elements.push("C");
b.elements.push("D");
When I examine the contents of these arrays, I see that both a.elements and b.elements contain {"A","B","C","D"} ! I.e. as if the two arrays are in fact the same array! But these are two separate instances of the class, I expect two separate arrays. Note that if instead I use the base class: Code: a = new baseClass();
a.elements.push("A");
a.elements.push("B");
b = new baseClass();
b.elements.push("C");
b.elements.push("D");
then I get a.elements = {"A","B"} and b.elements = {"C","D"}, as I would expect. Could someone explain to me the problem with using the derived class? Thank you, Stephanos I've noticed that if you declare a variable in one function, then call another function, the variables cannot be accessed in that function. Is there any way to get the value of a variable declared in a different function?
Hi All, I am opening window using following code : Code: <script>window.open('Results.aspx?sorttype=text&sort=OTName&sortname=Document&sortorder=ascending','Results','top=0,left=0,height=715,width=" & sRsultWindowSize & ",toolbar=no,status=yes,resizable=yes,scrollbars=no,location=no')</script>
I want to keep new window top of the parent window. How can i achieve that ? Thanks for your help -John hi, i'm trying to keep a copy of a variable at 4 digits.. this is what i came up with.. it's working but i'm only a noob, so i would very like to know is there any other simpler and/or elegant way to do this.. also i would appreciate it if you could point out any bad syntax or something.. Code:
page = 100
function makeit4digits(){
page4digit = page
if (page<10)
{
page4digit = "000"+ page
}
else if (page<100)
{
page4digit = "00"+ page
}
else if (page<1000)
{
page4digit = "0"+ page
}
}
Hi, i am having some problems keeping the formatting of elements the same for html and javascript, i have a seperate css file for all the formatting of the tags in html, and when i use javascript i want it to stay the same. eg. when i use <h2> Heading </h2> below it wont print the same style as above, the color is the same, but the text is bigger and bold. <script type="text/javascript"> document.write("<h2> Heading </h2>); </script> Any help will be greatly appreciated. Thanks I want to keep the exact same formatting for both, using the Beginner here, so please bear with me... Essentially, I'm trying to put together a survey which keeps a running total at the bottom of the page that is updated each time the user makes a choice. So, something like this: Checkbox A - $5.00 Checkbox B - $10.00 Checkbox C - $20.000 Total _____ (Where Total is a textbox.) Originally, I thought this would be easy -- I could just include the onClick attribute in the input tags and call a function each time a checkbox is selected. The problem is that the survey software I'm using doesn't seem to allow me to alter the input tags. Basically, I can create the survey using their customized software and it generates the form, input tags, etc. I can then add customized html/javascript before and after each question. All the code I add appears within the same form. So, is there an easy way to solve this problem without altering the input tags? Hi, I have three buttons on my site. When a button is clicked it pulls down a javascript pop up questionaire box. When the person closes the box they're redirected to Paypal depending on which button they clicked, hence the 3 if else options toward the end of this script. How might the following code be rewritten so that the pop up box no longer exists, but so the options still function and redirect correctly to Paypal? Code: <script type="text/javascript">
function popup(option){
Modalbox.show('<div><p>How did you learn about Dinosaur Pop?</p> <textarea id="message" name="message" rows="4" cols="30"></textarea><br><br><input type="button" value="Send" onclick="Modalbox.hide(); redirect(' + option + ');" /> or <input type="button" value="No, leave it!" onclick="Modalbox.hide(); redirect(' + option + ');" /></div>', {title: "Question", width: 300});
return false;
}
function redirect(option)
{
var messageObj = document.getElementById("message");
if (messageObj != null && messageObj.value != "")
{
var url = 'submit_message.php?message=' + encodeURIComponent(messageObj.value);
new Ajax.Request(url, {
method: 'get',
onSuccess: function(transport) {
}
})
}
if (option == 1)
document._xclick.submit();
else if (option == 2)
document._xclick1.submit();
else if (option == 3)
window.location = "download/Dinosaur Pop Book.pdf";
}
</script>
This is just a goofy little project to add to my learning, but I've come across a problem that would be nice to solve. It is not a TinyMCE or other JS editor replacement, just something to play with for the holidays! In the following program, you can create an HTML template then add/modify common elements and display the results. I can place tags around highlighted areas and insert/append functions where the cursor is positioned. Works OK so far. The problem is when the text exceeds the <textarea> boundaries and I try to tag or insert at cursor, the display reverts to the first line of the <textarea> display. I would like to keep the displayed area within the boundaries and just push down the inserted text. Problem: Is there a simple way to accomplish this task or do I just have to put-up with the bouncy display whenever I insert code into the area? Code: <html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Simple JS Editor</title>
<!--
One annoyance: When <textarea> content exceeds size of element
additional entries cause display to JUMP to beginning
of the area being edited.
-->
<style type="text/css">
.tags { background-Color:lightblue; }
.objs { background-Color:pink; }
.ctrl { background-Color:lime; }
</style>
<script type="text/javascript" language="javascript"> <!-- External: src="InsertText.js"></script -->
// function insertAtCursor(myField, myValue) {
function InsertText(myField, myValue) {
//IE support
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
}
//MOZILLA/NETSCAPE support
else if (myField.selectionStart || myField.selectionStart == '0') {
// else if (myField.selectionStart != 'undefined') {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
} else { myField.value += myValue; }
myField.focus(); // new entry here
}
// calling the function
// insertAtCursor(document.formName.fieldName, value);
</script>
<script type="text/javascript"> <!-- External: src="InsertCode.js"></script -->
// Modified from:
// http://www.codingforums.com/showthread.php?t=134113 - Author Kor
// http://www.codingforums.com/showthread.php?t=182713
var HTMLstart = ['<!DOC HTML>',
'<html>','<head>','<title> Untitled </title','',
'<style type="text\/css"><\/style>','',
'<script type="text\/javascript">',
' function $_(IDS) { return document.getElementById(IDS); }',
'<\/script>','',
'</head>','<body>','','<h1> Test </h1><hr>','',
'</body>','</html>'
];
var RBtnStart = ['<input type="radio" name="RBtn" value="0">RBtn 1',
'<input type="radio" id="RBtn" name="RBtn" value="1">RBtn 2',
'<input type="radio" id="RBtn" name="RBtn" value="2">RBtn 3',''
];
var CBoxStart = ['<input type="checkbox" id="CBox0" name="CBox0" value="A">CBox A',
'<input type="checkbox" id="CBox1" name="CBox1" value="B">CBox B',''
];
var SBoxStart = ['<select id="SBox" name="SBox">',' <option value="">Pick</option>',
' <option value="1">1</option>',' <option value="2">2</option>',
' <option value="3">3</option>',' <option value="4">4</option>',
' <option value="5">5</option>',' <option value="6">6</option>',
'</select>',''
];
var TblsStart = ['<table border="1">','<caption> Table </caption',
' <tr>',' <td> 1 </td>',' <td> 2 </td>',' </tr>',
' <tr>',' <td> 3 </td>',' <td> 4 </td>',' </tr>',
'</table>',''
];
var ULstart = ['<ul>',' <li> 1 </li>',' <li> 2 </li>',' <li> 3 </li>','</ul>',''];
var OLstart = ['<ol>',' <li> A </li>',' <li> B </li>',' <li> C </li>','</ol>',''];
var DLstart = ['<dl>',' <dt> A </dt>',' <dt> B </dt>',' <dt> C </dt>','</dl>',''];
function formatText(el,tag){
var selectedText = document.selection
?document.selection.createRange().text
:el.value.substring(el.selectionStart,el.selectionEnd); // IE:Moz
if (selectedText == "") {return false}
var newText='<'+tag+'>'+selectedText+'</'+tag+'>';
if(document.selection) { document.selection.createRange().text=newText; } // IE
else { // Moz
el.value=el.value.substring(0,el.selectionStart)+newText+el.value.substring(el.selectionEnd,el.value.length);
}
}
</script>
</head>
<body>
<form name="myForm" onsubmit="return false">
<textarea id="myTextarea" name="myTextarea" rows="18" cols="80"
style="font-family: monospace; font-size: 12pt; float: left;"></textarea>
<div style="float: left;"><h3 class="tags">Enclose (highlighted)</h3>
<input class="tags" value="Bold" onclick="formatText (myTextarea,'b');" type="button">
<input class="tags" value="Italic" onclick="formatText (myTextarea,'i');" type="button">
<input class="tags" value="Underline" onclick="formatText (myTextarea,'u');" type="button">
<br>
<input class="tags" value="h1" onclick="formatText (myTextarea,'h1');" type="button">
<input class="tags" value="h2" onclick="formatText (myTextarea,'h2');" type="button">
<input class="tags" value="h3" onclick="formatText (myTextarea,'h3');" type="button">
</div>
<div style="float: left;"><h3 class="objs">Insert</h3>
<button class="objs" onClick="InsertText(this.form.myTextarea,RBtnStart.join('\n'))">RBtn</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,CBoxStart.join('\n'))">CBox</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,SBoxStart.join('\n'))">SBox</button>
<br>
<!--
<button class="objs" onclick="alert('Not coded yet')">1D-Array</button>
<button class="objs" onclick="alert('Not coded yet')">2D-Array</button>
<button class="objs" onclick="alert('Not coded yet')">Populate</button>
<br>
<button class="objs" onclick="alert('Not coded yet')">Toggle</button>
-->
<button class="objs" onClick="InsertText(this.form.myTextarea,TblsStart.join('\n'))">Tabel</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,'<br>')">br</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,'<p>')">p</button>
<br>
<button class="objs" onClick="InsertText(this.form.myTextarea,ULstart.join('\n'))">ul-li</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,OLstart.join('\n'))">ol-li</button>
<button class="objs" onClick="InsertText(this.form.myTextarea,DLstart.join('\n'))">dl-dt</button>
</div>
<div style="float: left;"><h3 class="ctrl">Control</h3>
<button class="ctrl" onclick="document.getElementById('myTextarea').value=HTMLstart.join('\n')">Template</button>
<button class="ctrl" onClick="javascript:this.form.myTextarea.focus();this.form.myTextarea.select();">
Highlight Text to Copy</button>
<button class="ctrl" onclick="document.getElementById('myTextarea').value=''">
Clear</button>
<p>
<button class="ctrl" onclick="document.getElementById('myEditResults').innerHTML = document.getElementById('myTextarea').value">
Display</button>
</div>
<div id="myEditResults" style="float:left; border: 1px solid red; height: 20em; width: 70em; overflow:auto;">
</div>
<br style="clear: both;">
</form>
</body>
</html>
Hello everyone, I have done a lot of research looking for answers on this one but unable to find anything that helps. I have a couple of questions on a page and each are contained in there own form. The questions themselves use checkboxes. I would like the page to not refresh and jump to the top of the page after they submit there answer. So on questions that use radio buttons I have been using Code: <input type="submit" value="Submit" onclick="get_radio_value(); return false;" /> for the submit buttion and that works perfect. I try and use it on questions that use checkboxes and it doesnt work so as a work around I am using the form's action attribute to set it to a link on the page. Here is my form code: Code: <form name="question2" action="#q2">2. <strong>Multiple choice:</strong><a name="q2"></a> Which patient or patients could be transferred to another hospital under the EMTALA Act?<br /> <input type="checkbox" value="a" name="aquestion" />Smith, Bill<br /><input type="checkbox" value="b" name="bquestion" />Wells, Patricia<br /> <input type="checkbox" value="c" name="cquestion" />Hamilton, Larry<br /> <input type="checkbox" value="d" name="dquestion" />Rodriquez, Brad<br /><input type="checkbox" value="e" name="equestion" />Baker, Madison<br /><input type="checkbox" value="f" name="fquestion" />Kahn, Brent<br /> <input type="checkbox" value="g" name="gquestion" />Cahill, Mark<br /><input type="submit" onclick="get_radio2_value()" value="Submit" /></form> <script type="text/javascript" src="first_triage_java_clinical.js"> </script> and here is the javascript code if it helps: Code: function get_radio2_value()
{
var w = 400;
var h = 400;
var wleft = (screen.width/2)-(w/2);
var wtop = (screen.height/2)-(h/2);
var wrong = "<html><head><style type='text/css'> * {margin: 0; padding:0; border:0;}</style>\
<title>Incorrect, try again!</title></head><body><bgsound src='Plbt.wav'>\
<a href='javascript:window.close()'><img src='wrong.jpg'></a></body></html>";
var right = "<html><head><style type='text/css'> * {margin: 0; padding:0; border:0;}</style>\
<title>You are Correct!</title></head><body>\
<a href='javascript:window.close()'><img src='right.jpg'></a></body></html>";
var correct = "false";
if (document.question2.cquestion.checked)
{
if(document.question2.dquestion.checked)
{
if(document.question2.equestion.checked)
{
if(document.question2.fquestion.checked)
{
if(document.question2.gquestion.checked)
{
var correct = "true";
}
}
}
}
}
if (document.question2.aquestion.checked)
{ var correct = "false"; }
if (document.question2.bquestion.checked)
{ var correct = "false"; }
if (correct != "true")
{ var popup = window.open('','','resizeable=no,scrollbars=no,width=221,height=112, top='+ wtop +', left='+ wleft);
popup.document.write(wrong);
pops.document.close();
}
else
{ var popup = window.open('','','resizeable=no,scrollbars=no,width=221,height=112, top='+ wtop +', left='+ wleft);
popup.document.write(right);
pops.document.close();
}
}
hi there, i have a problem which is there is some javascript codes keeping the #usemap tag from working here is my webpage Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta content='text/html; charset=windows-1256' http-equiv='Content-Type' />
<title>Assiut map</title>
<script src="shiftzoom.js" language="javascript" type="text/javascript"></script>
<script type="text/javascript">
<!--
if(document.images&&document.createElement&&document.getElementById){
document.writeln('<style type="text/css">');
document.writeln('img.shiftzoom { visibility: hidden; }');
document.writeln('<\/style>');
}
shiftzoom.defaultCurpath = 'images/cursors/';
//-->
</script>
</head>
<body>
<div id="content">
<div style="float: left; width:700px; height:300px; border:1px solid gray; margin-right: 1em; margin-bottom: 0.25em;">
<div style="width:700px; height:300px; background: url(images/indicator.gif) 50% 50% no-repeat;">
<img id="map" usemap="#map" class="shiftzoom" onLoad="shiftzoom.add(this,{showcoords:false,zoom:100});" src="assiut.jpg" width="700" height="300" alt="large image" border="0" />
</div></div></div>
<map name="map" id="map">
<area shape="circle" coords="250,160,15" href="#nowhere" title="Ahmed house<br>name:ahmed<BR>Class:1-1" alt="" />
<area shape="circle" coords="110,164,15" href="#nowhere" title="Mohamed house<br>name:Mohamed<BR>Class:2-1" alt="" />
<area shape="circle" coords="190,362,15" href="#nowhere" title="Mostafa house<br>name:Mostafa<BR>Class:3-1" alt="" />
</map>
</body>
</html>
the .js file in attachments which have somthing that keeps the #usemap from working, would be so thankful if anyone could help thanks I am using javascript that will show/hide a DIV if a link is clicked. In the DIV is a form. When the user input's form info, and the form is processed, if there is an error the page reloads displaying the error. However, the user must click the link again to see the form and correct their mistake. Is there a way to keep the div shown on reload? Thanks! Code: <script language="javascript">
function toggle() {
var ele = document.getElementById("show");
var text = document.getElementById("add");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "show";
}
else {
ele.style.display = "block";
text.innerHTML = "Hide";
}
}
</script>
Hi all: I've got a script that reads a line of text from a file, and does a bit of parsing to that line into an array. Apparently, this can take some time, so I get the "Stop running this script?" message. From what I understand, I need to use the setTimeout call, but for the life of me can't understand it. When I do add it to some code, it seems to work, but doesn't "pause" the code as I expect it too... Code: function ReadFile(Fname)
{
var path = "y:\\metrics\\";
var file, x=0, ForReading=1;
file = fso.OpenTextFile(path+Fname, ForReading, false);
do
{
var fileLine = file.readline();
var arrSplit = GetItems(fileLine);
}
while (!file.AtEndOfStream);
file.close();
return(x);
}
function GetItems(recordLine)
{
var ItemsTemp=[];
var finishString, itemString, itemIndex, charIndex, inQuote, testChar;
inQuote = false; charIndex= 0; itemIndex=0; itemString = ""; finishString = false;
var count = 0;
do
{
if (++count >= 100)
{
delay = setTimeout("", 1, []);
count = 0;
return;
}
testChar = recordLine.substring(charIndex,charIndex+1);
finishString = false;
if (inQuote)
{
if (testChar == "\"")
{
inQuote = false;
finishString = true;
++charIndex;
}
else
{
itemString = itemString + testChar;
}
}
else
{
if (testChar == "\"")
{
inQuote = true;
}
else if (testChar == ",")
{
finishString = true;
}
else
{
if (testChar == "=")
{
testChar = "";
}
itemString = itemString + testChar;
}
}
if (finishString)
{
ItemsTemp.push(itemString);
itemString = "";
++itemIndex;
}
++charIndex;
}
while (charIndex <= recordLine.length);
return(ItemsTemp);
}
Any help would be greatly appreciated! Thanks, Max The page loads and existing data is put in their correct fields. When I click 'add more' to add more fields to the form it does so and I am able to add new data. If on adding a new fields and its data I click 'add more' again it clears out the recently added data from the fields. The existing data that was present when the page first loaded is still their but all the new fields added data is cleared. how can I get it so the data stays, like in phpmyadmin when adding new fields. JS Code: function addmore(addwhat) {
// count existing boxes to find out next number to use.
// ?
if (addwhat == 'addresses') {
fieldid = 'addressesdiv';
}
if (addwhat == 'namesnumbers') {
fieldid = 'namesdiv';
}
var dv = document.getElementById(fieldid).innerHTML;
var lines = dv.match(/<br>/ig).length;
if (addwhat == 'addresses') {
document.getElementById('addressesdiv').innerHTML += '<textarea name="address' + lines + '" cols="30" rows="2"></textarea><br>';
}
if (addwhat == 'namesnumbers') {
document.getElementById('namesdiv').innerHTML += '<textarea name="name' + lines + '" cols="30" rows="2"></textarea><br>';
document.getElementById('mobilesdiv').innerHTML += '<textarea name="mobile' + lines + '" cols="30" rows="2"></textarea><br>';
}
}
PHP Code: <?
if ($_POST['Submit'] == 'Submit') {
echo("sent<br>");
for ($c = 1; $c <= (count($_POST)-1)/2; $c++) {
echo("name" . $c . " = " . $_POST['name'.$c] ." mobile" . $c . " = " . $_POST['mobile'.$c] . "<br>");
}
}
$customer_id = "11";
// get existing data.
// if not yet sent get data from databases
$ok = "no";
if ($_POST['Submit'] != "Submit") {
echo("<br>not sent<br>");
$res = db_query("SELECT * FROM `customer_client_names` WHERE `customer_id` = '". $customer_id ."'");
$maincount = mysql_num_rows($res);
echo("<br>number of clients = ".$maincount."<br>");
for ($c = 1; $c <= $maincount; $c++) {
$_POST['name'.$c] = mysql_result($res, $c-1, "client_name");
$_POST['mobile'.$c] = mysql_result($res, $c-1, "client_mobile");
echo("cn = ".$_POST['name'.$c] . " cm = ".$_POST['mobile'.$c] . "<br>");
}
} else {
// display last posted info
echo("<br>sent<br>");
$ok = "yes";
// check if info was entrted correctly or not.
for ($c = 1; $c <= ((count($_POST)-1)/2); $c++) {
if ($_POST['name'.$c] != "" && $_POST['mobile'.$c] == "") {
echo("<br>" . $_POST['name'.$c] ." was not given a mobile number<br>");
$ok = "no";
$maincount ++;
}
if ($_POST['name'.$c] == "" && $_POST['mobile'.$c] != "") {
echo("<br>" . $_POST['mobile'.$c] ." mobile was not given a name<br>");
$ok = "no";
$maincount ++;
}
}
}
if ($ok == "no") {
?>
<form name="form1" method="post" action="?ac=<?=$menu_item;?><? echo("&phpsession=" . $phpsession); ?>">
<div style="width: 850px;">
<div id="namesdiv" style="float: left; padding-right: 10px;">Client's Names<br>
<? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) {
if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") {
?>
<textarea name="<?='name'.$c;?>" cols="30" rows="2"><?=$_POST['name'.$c];?></textarea><br>
<?
}
} ?>
</div>
<div id="mobilesdiv" style="float: left;">Client's Mobile numbers<br>
<? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) {
if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") {
?>
<textarea name="<?='mobile'.$c;?>" cols="30" rows="2"><?=$_POST['mobile'.$c];?></textarea><br>
<?
}
} ?>
</div>
</div>
<br style="clear: both;">
<a href="#" onClick="javascript:addmore('namesnumbers'); return false;" >Add more</a>
<input type="hidden" name="customer_id" value="<?=$customer_id;?>">
<input type="submit" name="Submit" value="Submit">
</form>
<?
}
?>
Hi guys. How would I implement this css: Code: .story-wrap:hover .dates This obviously allows the .dates div to react when I hover over the .story-wrap div. How would I select the same in javascript with this code: Code: $(".story-wrap .dates").hover(function () {
Because currently it just reacts when .dates is hovered over. Cheers! |
|||||||