|
JavaScript - Ddaccordion Does Not Work
the side menu should be something like this
http://www.dynamicdrive.com/dynamici...enu-glossy.htm here is what i made it doesn't seem to get the javascript.. this is the template.php source code Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex17/ddaccordion.js">
/***********************************************
* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/
</script>
<script type="text/javascript">
ddaccordion.init({
headerclass: "submenuheader", //Shared CSS class name of headers group
contentclass: "submenu", //Shared CSS class name of contents group
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["suffix", "<img src='plus.gif' class='statusicon' />", "<img src='minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing
}
})
</script>
<style type="text/css">
.glossymenu{
margin: 5px 0;
padding: 0;
width: 170px; /*width of menu*/
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}
.glossymenu a.menuitem{
background: black url(glossyback.gif) repeat-x bottom left;
font: bold 14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: white;
}
.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 5px;
border: none;
}
.glossymenu a.menuitem:hover{
background-image: url(glossyback2.gif);
}
.glossymenu div.submenu{ /*DIV that contains each sub menu*/
background: white;
}
.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
}
.glossymenu div.submenu ul li{
border-bottom: 1px solid blue;
}
.glossymenu div.submenu ul li a{
display: block;
font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: black;
text-decoration: none;
padding: 2px 0;
padding-left: 10px;
}
.glossymenu div.submenu ul li a:hover{
background: #DFDCCB;
colorz: white;
}
</style>
<link href="style.css" rel="stylesheet" type="text/css" />
<title>this is a template</title></head>
<body class="twoColElsLt">
<div class="header">
<table width="200" border="0">
<tr>
<td> </td>
</tr>
</table>
</div>
<div id="container">
<div id="sidebar1">
this is the sidebar
<div class="glossymenu">
<a class="menuitem" href="http://www.dynamicdrive.com/">Dynamic Drive</a>
<a class="menuitem submenuheader" href="http://www.dynamicdrive.com/style/" >CSS Examples</a>
<div class="submenu">
<ul>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links & Buttons</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>
</ul>
</div>
<a class="menuitem" href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
<a class="menuitem" href="http://www.javascriptkit.com/domref/">DOM Reference</a>
<a class="menuitem submenuheader" href="http://www.cssdrive.com">CSS Drive</a>
<div class="submenu">
<ul>
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
<li><a href="http://www.cssdrive.com/index.php/menudesigns/">Menu Gallery</a></li>
<li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
<li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
<li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
<li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
</ul>
<img src="http://i27.tinypic.com/sy7295.gif" style="margin: 10px 5px" />
</div>
<a class="menuitem" href="http://www.codingforums.com/" style="border-bottom-width: 0">Coding Forums</a>
</div>
</div>
<div id="mainContent">
<h1> Main Content </h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. </p>
<p>Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</p>
<h2>H2 level heading </h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<!-- end #container --></div>
Copyright 2009 sher_amf
</body>
</html>
Similar TutorialsHello all, I made a fade script that will fade any element in or out. Works great on all browser I've tested but IE 7. With IE I have only tested this will IE 8 and IE 7. IE 7 the effect doesn't work. No error message or anything. I'm unsure what to do from here. I was hoping I could find some help here. Code: function fade(obj, duration, toggle) {
steps = 1000;
elem = document.getElementById(obj);
function fadeIn() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ i +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ i * 102 +")'", i * duration);
}
}
function fadeOut() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ (1-i) +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ (1-i) * 102 +")'", i * duration);
}
}
/* One for Fade in and anything will be fade out*/
if(toggle == 1) {
fadeIn();
}
else {
fadeOut();
}
}
Thanks, Jon W So i got this to work once, but i can't get it to work now. I am trying to make it so when i clicked a radio button, i get the description of each object i click. Please help!!! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd"> <head> <script type="text/javascript"> var vegetarian="lots of mushrooms" var hawaiian="overloaded with juicy" var meatlovers="loads of pepperoni" </script> </head> <body> <form name="pizzaList" action="" method="get"> <p> Click the buttons for a description of each pizza.</p> <p> <input type="radio" name="pizzas" onclick="document.pizzaList.pizzaDesc.value=vegetarian" />Vegetarian <input type="radio" name="pizzas" onclick="document.pizzaList.pizzaDesc.value=hawaiian" />Hawaiian <input type="radio" name="pizzas" onclick="document.pizzaList.pizzaDesc.value=meatlovers" />MeatLovers </p> </form> <p> <textarea name="pizzaDesc"></textarea></p> <html xlmns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> </html> Can somebody give me a bit of help with the below code. The problem is that it works fine for the first pop up box but not for the other(s). I think it has something to do with the script using the getelementbyid. Can anybody help? Code: <script type="text/javascript">
var appearance = "notShown"
function show()
{
if (appearance == "notShown")
{
document.getElementById('P1').style.display = "inline";
appearance = "shown";
}
}
function remove()
{
document.getElementById('P1').style.display = "none";
appearance = "notShown";
}
</script>
<style type="text/css">
p#P1 { width: 319px; height: 169px; display:none; background-color: grey; position:absolute;z-index:2; }
p#P1 b { padding: 10px; float: left; }
p#P1 span { width: 300px; float: left; padding: 10px;}
button.close {float:right; margin: 5px; }
</style>
<a href="#" onclick="show()">box 1</a>
<p id="P1"><b>Lorem Ipsum</b><button type="button" class="close" onclick="remove()">X</button>
<span>Lorem ipsum ut volumus antiopam pericula vix, per nulla oblique alienum ad. No ullum convenire eos. Sit tota iusto ut, ex mentitum voluptatum inciderint est. Ex dico idque argumentum eam, ei elit meliore definiebas per, nam soleat aliquando ad.</span>
</p>
<br /><br /><br /><br /><br /><br />
<a href="#" onclick="show()">box 2</a>
<p id="P1"><b>Lorem Ipsum</b><button type="button" class="close" onclick="remove()">X</button>
<span>Lorem ipsum ut volumus antiopam pericula vix, per nulla oblique alienum ad. No ullum convenire eos. Sit tota iusto ut, ex mentitum voluptatum inciderint est. Ex dico idque argumentum eam, ei elit meliore definiebas per, nam soleat aliquando ad.</span>
Hi there! I'm completely new to javascript coding, but have suddenly found myself in need of using it. here's a little background (helps me keep track of where I am in my question). I've been "playing" with php for quite a while, and I decided I wanted to see how hard it would be to code a fairly simple forum. So far, everything is working out with very little need for bug fixes and some efficiency suggestins from a friend. I'm currently building the registration page, and wanted to have it compare the password and verification while the form is being filled. I found a code to do it after a few searches, but evidently I am missing something about how it works. This is the code I found: Code: <script type='text/javascript'>
function comparePasswords()
{
if(document.getElementById('pass1').value != document.getElementById('pass2').value)
{
$('passwordShow').innerHTML = 'Passwords do not match';
}
else
{
$('passwordShow').innerHTML = '';
}
}
</script>
This is the full code for the form I am trying to use it in: Code: <?php
echo "<script type='text/javascript'>\n function comparePasswords()\n {\n if(document.getElementById";
echo "('pass1').value != document.getElementById('pass2').value)\n {\n $('passwordShow').innerHTML";
echo " = 'Passwords do not match';\n }\n else\n {\n $('passwordShow').innerHTML = '';\n";
echo " }\n }\n</script> ";
echo "<form action='index.php?pg=verify' method='post'>";
echo "<table align='center' style='color: #C0C0C0'>";
echo "<tr><td>Username:</td><td><input type='text' name='user' /></td></tr>";
echo "<tr><td>Password:</td><td><input type='password' name='pass1' /></td></tr>";
echo "<tr><td>Re-enter Password</td><td><input type='password' name='pass2' onkeyup='comparePasswords();' /></td></tr>";
echo "<tr><td>Email<br />(used for password recovery)</td><td><input type='text' name='email' /></td></tr>";
require ('questions.php');
echo "<input type='hidden' name='source' value='reg' />";
echo "<br><center><input type='submit'/></form>";
?>
What am I not understanding about this? Hi I'm doing some js online tutorials and am stuck at this piece of code. It's supposed to be a carousel that loops. It's supposed to have the main image in the middle and images on either side of it. Something similar to www.atlanticrecords.com. But my code doesn't make it slide. I'm a complete novice to javascript and am desparate for this to work. This is the code if anyone would like to show me my mistakes. 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>Interactive Carousel</title>
<style type="text/css">
#feature_holder{position:relative; top:150px; overflow:hidden; height:400px; width:100%;}
.feature{position:absolute; width:1000px; height:400px; top:0; z-index:1;}
.arrow_right{right:20px;}
.arrow_left{left:20px;}
.arrow{height: 70px; width:70px; z-index:2; top:160px; position:absolute; background:#000;}
#feature_1{background: #666666;}
#feature_2{background: #225566;}
#feature_3{background: #006600;}
#feature_4{background: #ff0066;}
#feature_5{background: #00ff00;}
#feature_6{background: #0380ff;}
</style>
</head>
<body>
<div id="feature_holder">
<div class="arrow arrow_left"></div>
<div class="arrow arrow_right"></div>
<div class="feature" id="feature_1"></div>
<div class="feature" id="feature_2"></div>
<div class="feature" id="feature_3"></div>
<div class="feature" id="feature_4"></div>
<div class="feature" id="feature_5"></div>
<div class="feature" id="feature_6"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>
var BrowserWidth
var FeatureCount
var CurrentFeature = 1
var NextFeature
var NextNextFeature
var PrevFeature
var PrevPrevFeature
$(document).ready (function(){
setFeatureCount()
getBrowserWidth()
setClicks()
setNextPrev()
setFeaturePosition()
});
setFeatureCount = function(){
FeatureCount = $('#feature_holder').children('.feature').length;
}
getBrowserWidth = function(){
BrowserWidth = $(window).width();
}
setClicks = function(){
$('#feature_holder').children('.arrow_left').click(function(){
SlideInFeature(true);
});
$('#feature_holder').children('.arrow_right').click(function(){
SlideInFeature(false);
});
}
setNextPrev = function(){
PrevFeature = (CurrentFeature-1);
PrevPrevFeature = (CurrentFeature-2);
NextFeature = (CurrentFeature+1);
NextNextFeature = (CurrentFeature+2);
if (CurrentFeature == 1){
PrevFeature = FeatureCount;}
setFeaturePosition = function(){
$('#feature_holder').children('.feature').css('left', -9999);
var CurrentPositioning = (BrowserWidth/2) - 500;
$('#feature_'+CurrentFeature).css('left', CurrentPositioning);
var NextPositioning = (BrowserWidth/2) + 500;
$('#feature_' +NextFeature).css('left', NextPositioning);
var PrevPositioning = (BrowserWidth/2) - 1500;
$('#feature_'+PrevFeature).css('left', PrevPositioning);
}}
</script>
</body>
</html>
Thanks I know we've all seen those text fields where when you type in am HTML tag it changes color! Example: <div> blah blah blah blah </div> I know that there is no flash involved, so how does it work? Hello again, I have written the following code: <script language="Javascript"> var win=0 </script> <Form name="Form"> <Input type="button" name="button" value="Click" onClick="Good()"> </form> <script language="Javascript"> function Good() { if (win=0) { alert('You win!') } else { alert("You lose!") } } </script> Based on the following, when I click the button it should say "You win!" as win=0 but it keeps saying "You lose!". Why is this happening? HI i have a form and submit bottom in my page . I've wrote a function that check the page element's value before submitting the form. my problem is this i couldn’t stop submitting the form before it has checked . Actually I want before the form submitted it has checked and if there was no problem then the function return true and submitted and if there was any problem, the function return false and the form stopped submitting I ‘ve added a function to the onclick of submit button and it call a function that check the values thanks hello, I found this script : http://roshanbh.com.np/2008/06/accor...ng-jquery.html I implemted this into my website http://test.tamarawobben.nl but as you can see it don't work. Can anyone help me figure out why the script does not work. Roelof So here is the story I paid for some to create a slideshow, and it works fine in the orginial html document but when i copy and paste the code into my html document the scroller to the left of the image stops moving up and down I put the working file at this address: http://rusty813.comuv.com/ my files at this address where i am: http://rusty813.comuv.com/sample2.html the guy i paid to do work refuses to help even those i advertised the price in my ad and he wanted me to give it to pay him more to tell which code to change but go ahead take a look at the coding thanks alot for your guys help Code: <html>
<script type="text/javascript">
var x=200;
function update()
{
document.getElementById('health').innerHTML=x;
}
function attack()
{
x=x-10;
}
if (x<10)
{
document.write("You Won")
}
</script>
<body onload="update()">
<div id="health">
</div>
<input type="button" value="Attack" onclick="attack()" />
</body>
</html>
I don't see that x loses 10 what's the problem. I'm new to JS and I can't get this function to display. Can you help me please?
Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Untitled</title>
<head>
<script type="text/javascript">
function creatediv(){
var nwdiv=document.createElement('div');
nwdiv.style.float='right'
nwdiv.id='mydiv';
var txt='hello world!';
document.body.apendChild(nwdiv);
document.getElementById(mydiv).innerHTML=txt;
document.write(txt);
}
</script>
<style type="text/css">
</style>
</head>
<body>
<form>
<input type="button" value="Click me!" onclick="creatediv()" />
</form>
</body>
</html>
Hi, I am creating a web page which automatically updates one image every 5 seconds. I use ajax to fetch a new img url every 5 seconds, and then update the image by changing img.src. I tested the same (in IE8, firefox) and it worked without any issues in my development server. But, when I try to put it on production server, many people are complaining that they are not able to see any image at all. Code: if (url_received){
var path = url.substring(url.indexOf("/"));
var img = document.getElementById("testimage");
img.src = "/test/media/" + path;
}
I cannot think of a reason why this is failing for others. Is this due to any security issues? If someone helps me out, I would be very thankful. This is a script which has a window slide down on the page and a user can choose yes/no to continue. It works in all browsers other than IE...any help please? If you need more info, please let me know. Thanks. <script language="JavaScript" type="text/javascript"> <!-- var allowpop=1; function popWin(){ var ppl="popLayer";var objppl=findObj(ppl); if (objppl==null){return;}// if the layer does not exist, do nothing. var args=arguments,movetoX=parseInt(args[0]),movetoY=parseInt(args[1]),movespeed=parseInt(args[2]); var cycle=10,pxl=""; if(!document.layers){objppl=objppl.style;} if(objppl.tmofn!=null){clearTimeout(objppl.tmofn);} var pplcoordX=parseInt(objppl.left),pplcoordY=parseInt(objppl.top); var xX=movetoX,yY=movetoY;if((pplcoordX!=movetoX)||(pplcoordY!=movetoY)){ var moveX=((movetoX-pplcoordX)/movespeed),moveY=((movetoY-pplcoordY)/movespeed); moveX=(moveX>0)?Math.ceil(moveX):Math.floor(moveX);movetoX=pplcoordX+moveX; moveY=(moveY>0)?Math.ceil(moveY):Math.floor(moveY);movetoY=pplcoordY+moveY; if((parseInt(navigator.appVersion)>4||navigator.userAgent.indexOf("MSIE")>-1) && (!window.opera)) {pxl="px";} if (moveX!=0){eval("objppl.left='" + movetoX + pxl + "'");} if (moveY != 0) {eval("objppl.top = '" + movetoY + pxl + "'");} var sFunction = "popWin(" + xX + "," + yY + "," + movespeed+ ")"; objppl.tmofn = setTimeout(sFunction,cycle); } } function findObj(theObj, theDoc){ var p, i, foundObj; if(!theDoc) theDoc = document; if((p = theObj.indexOf("?")) > 0 && parent.frames.length) {theDoc = parent.frames[theObj.substring(p+1)].document; theObj = theObj.substring(0,p);} if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj]; for (i=0; !foundObj && i < theDoc.forms.length; i++) foundObj = theDoc.forms[i][theObj]; for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++) foundObj = findObj(theObj,theDoc.layers[i].document); if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj); return foundObj; } function hideLayer(layername){ layer=findObj(layername); if(layer.style){layer=layer.style;} layer.visibility='hidden'; } // --> </script> Hi, I could not get the radio to work. I need to be able tot select the different radio buttons in which it will produce different rates for calculation. But after reaching here, am not sure what is wrong with the coding as there are no error msgs, and it only uses the 18/0.18 rates, even when 25/0.28 rates are selected. Could someone advise me? Thanks Code as show below- Code: <a name="A"></a>
<script language="JavaScript">
function stocks(form) {
shares = form.shares.value * 1;
buyprice = form.buyprice.value * 1;
sellprice = form.sellprice.value * 1;
dividends = form.dividends.value * 1;
buyoption = form.buyoption.value * 1;
selloption = form.selloption.value * 1;
//Checking Buy Commission
if (buyoption>24)
{
bco1=25;
bco2=0.28;
}
else
{
bco1=18;
bco2=0.18;
}
//Checking Sell Commission
if (selloption>24)
{
sco1=25;
sco2=0.28;
}
else
{
sco1=18;
sco2=0.18;
}
//Calc Buying Cost
ba1=shares*buyprice;
ba2=bco1;
ba3=(shares*buyprice)/100*0.04;
ba4=(shares*buyprice)/100*0.0075;
ba5=(ba2+ba3+ba4)/100*7;
baf=Math.round((ba1+ba2+ba3+ba4+ba5)*100)/100;
bb1=shares*buyprice;
bb2=(shares*buyprice)/100*bco2;
bb3=(shares*buyprice)/100*0.04;
bb4=(shares*buyprice)/100*0.0075;
bb5=(bb2+bb3+bb4)/100*7;
bbf=Math.round((bb1+bb2+bb3+bb4+bb5)*100)/100;
//Compare Cost
if (baf>bbf)
{
bc=baf;
}
else
{
bc=bbf;
}
//Calc Selling Cost
sa1=shares*sellprice;
sa2=sco1;
sa3=(shares*sellprice)/100*0.04;
sa4=(shares*sellprice)/100*0.0075;
sa5=(sa2+sa3+sa4)/100*7;
saf=Math.round((sa1-(sa2+sa3+sa4+sa5))*100)/100;
sb1=shares*sellprice;
sb2=(shares*sellprice)/100*sco2;
sb3=(shares*sellprice)/100*0.04;
sb4=(shares*sellprice)/100*0.0075;
sb5=(sb2+sb3+sb4)/100*7;
sbf=Math.round((sb1-(sb2+sb3+sb4+sb5))*100)/100;
//Compare Returns
if (saf<sbf)
{
tr=saf;
}
else
{
tr=sbf;
}
//Calc Break Even Price
bepwod1=(bc/shares);
bepwd1=((bc-dividends)/shares);
bepwod=bepwod1.toFixed(3);
bepwd=bepwd1.toFixed(3);
//Calc Profit and Loss
plwod1=tr-bc;
plwd1=tr+dividends-bc;
plwod=plwod1.toFixed(3);
plwd=plwd1.toFixed(3);
//Returning Values
bought = bc; // Total Cost
sold = tr; // Total Returns
form.buycost.value = "$ " + bought;
form.sellcost.value = "$ " + sold;
form.breakevenpricewod.value = "$ " + bepwod;
form.breakevenpricewd.value = "$ " + bepwd;
form.profitlosswod.value = "$ " + plwod;
form.profitlosswd.value = "$ " + plwd;
}
</script>
<center>
<form name='stockform'>
<table border=0>
<tr>
<td align=left>* No. of Shares</td>
<td>:</td>
<td><input type="text" name="shares" /></td>
<td align=left>Total Cost</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="buycost" /></td>
</tr>
<tr>
<td align=left>* Buying Price</td>
<td>:</td>
<td><input type="text" name="buyprice" /></td>
<td align=left>Total Returns</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="sellcost" /></td>
</tr>
<tr>
<td align=left>* Selling Price</td>
<td>:</td>
<td><input type="text" name="sellprice" /></td>
<td align=left>Break Even Price w/o Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="breakevenpricewod" /></td>
</tr>
<tr>
<td align=left>* Dividends</td>
<td>:</td>
<td><input type="text" name="dividends" /></td>
<td align=left>Break Even Price w Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="breakevenpricewd" /></td>
</tr>
<tr>
<td align=left>Buy @ Commission</td>
<td>:</td>
<td><input type="radio" name="buyoption" value="18" checked>$18/0.18%<br>
<input type="radio" name="buyoption" value="25">$25/0.28%<br></td>
<td align=left>Profit & Loss w/o Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="profitlosswod" /></td>
</tr>
<tr>
<td align=left>Sell @ Commission</td>
<td>:</td>
<td><input type="radio" name="selloption" value="18">$18/0.18%<br>
<input type="radio" name="selloption" value="25" checked>$25/0.28%<br></td>
<td align=left>Profit & Loss w Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="profitlosswd" /></td>
</tr>
<tr>
<td colspan=3 align=center>
<input type="button" name="calc" value="Calculate" onclick="javascript:stocks(this.form)" />
</td>
<td align=left></td>
<td></td>
<td></td>
</tr>
</table>
</form>
</center>
I'm pretty new to Javascript programming. I have this function I created that is basically pretty simple. It does edit checks, however, at the end of my script, I display an error message using an alert statement and at the end of the first sentence, the word "undefined" shows up before the line break. The only thing I can think of that is causing it is the "+" sign. Here is my code below: Code: function CheckEdits() {
var msg;
ok = true;
if (document.getElementById("txtName").value == '') {
msg = msg + '\nName';
ok = false;
}
if (document.getElementById("txtOrganization").value == '') {
msg = msg + '\nOrganization';
ok = false;
}
if (document.getElementById("txtSubject").value == '') {
msg = msg + '\nSubject';
ok = false;
}
if (document.getElementById("txtNote").value == '') {
msg = msg + '\nNote';
ok = false;
}
if (msg != '') {
var msg2;
msg2 = "Please provide the following:\n" + msg;
alert(msg2);
}
}
What am I doing wrong? Thanks! I am terrible at this. I want to get this functionality seen here http://davidlynch.org/js/maphilight/docs/demo_usa.html (image map areas highlighting on mouseover) to work on this here http://scratchitrich.com/test/ can anybody walk me through how to make this work? Thanks! I've been working for some time trying to get XMLHTTPRequests to work. Nothing doing. The code seems simple enough, but I can't duplicate it on my own. I have two pages on the same PC. Code to follow. Please help me see the problem: Page One - Originator <code> <html> <head> <title>Origination</title> <script type='text/javascript'> function ajaxRequest(){ var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"]; //activeX versions to check for in IE if (window.ActiveXObject){ //Test for support for ActiveXObject in IE //first (as XMLHttpRequest in IE7 is broken) for (var i=0; i<activexmodes.length; i++){ try{ return new ActiveXObject(activexmodes[i]); } catch(e){ //suppress error } } } else if (window.XMLHttpRequest) // if Mozilla, Safari etc return new XMLHttpRequest(); else return false; } //Usage: //new ajaxRequest() function getStuff() { var getdata = new ajaxRequest(); if (getdata.readyState==4){ if (getdata.status==200){ var htmldata=getdata.responseText var txtfields = htmldata.getElementsByTagName('input'); alert(txtfields); } else{ alert('An error has occured making the request'); } } getdata.open('POST', 'test.html', true); getdata.send(null); } </script> </head> <body> <h5>Origination</h5> <form <form action="file:///test.html" method="post" enctype="text/plain"> <input type='text' name='homepage' value=''/> <input type='button' name='getit' value='GetSome' onclick='getStuff()'/> </form> </body> </html> </code> Page Two - The Target Page: <code> <html> <head><title></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/> <script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"/> <style type="text/css"> html {font-family: arial; font-size: 0.8em; } </style> </head> <body> <div id="wrapper"> <form action="file:///eyec.html" method="post" enctype="text/plain"> <input type='text' name='first' value='First Field'/> <input type='text' name='second' value='Second Field'/> <input type='text' name='third' value='Thrird Field'/> <input type='text' name='fourth value='Fourth Field'/> </form> </div> <!-- wrapper --> </body> </html> </code> I'd deeply appreciate correction. Thanks. Hi, I'm trying to use one of the free scripts from Javascriptkit.com, and modifying it to work the way I would like it to. Therefore I have cut parts of it out (href refrences and anchor tags). This is an image rollover script that loads an enlarged image onMouseover to " function warp()". This image is 400x300px and is loaded from thumbnail images. The script works fine as it was written, even after my cutting some of it. The problem I have is that I want to add an onMouseout function that will reload the first image when the mouse moves off of the thumbnail. I am just learning coding, and have not been able to get the onMouseout to work, and I've tried everything I can think of, so I'm hoping you will help, my code is Code:
<script>
/*Rollover effect on different image script-
By JavaScript Kit (http://javascriptkit.com)
Over 200+ free scripts here!
*/
function changeimage(towhat){
if (document.images){
document.images.targetimage.src=towhat.src
}
}
function warp(){
}
</script>
<script language="JavaScript1.1">
var myimages=new Array()
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
preloadimages("img1.jpg","img2.jpg","img3.jpg","img4.jpg","img5.jpg","img6.jpg")
</script>
<p class="roller">
<"javascript:warp()"><img src="img6.jpg" name="targetimage" border=0><br>
<p class="roller">
<img src="image1.jpg" width="121" height="91" alt="" border="1" onMouseover="changeimage(myimages[0],this.image)";onMouseout="changeimage(myimages[5]),this.image)">
<img src="images/thumb2.jpg" width="121" height="91" alt="" border="1" onMouseover="changeimage(myimages[1],this.image)";onMouseout="changeimage(myimages[5],this.image)">
<img src="images/thumb3.jpg" width="121" height="91" alt="" border="1" onMouseover="changeimage(myimages[2],this.image)";onMouseout="changeimage(myimages[5]),this.image)">
<img src="images/thumb4.jpg" width="121" height="91" alt="" border="1" onMouseover="changeimage(myimages[3],this.image)";onMouseout="changeimage(myimages[5]),this.image)">
<img src="images/thumb5.jpg" width="121" height="91" alt="" border="1" onMouseover="changeimage(myimages[4],this.image)";onMouseout="changeimage(myimages[5]),this.image)">
|
|||||||