|
JavaScript - Ie Issue With Drop Down Javascript Code
Hi,
I'm trying to edit a script that allows multiple drop downs, and simply adds a table depending on the answers (ready for form submittion) this works 100% in firefox, but falls over in IE.... this is the code Code: <script type="text/javascript">
function f (sel) {
var d = document, dv;
if (d.getElementById) {
for (var ii=0; ii < sel.options.length; ii++) {
dv = d.getElementById(sel.options[ii].value);
if(dv) dv.style.display = sel.options[ii].selected? "block": "none";
}
}
}
function convf (sl) {
if (sl.selectedIndex==1) {
var disp = document.getElementById('yesc');
disp.style.display='block';
} else {
var disp = document.getElementById('yesc');
disp.style.display='none';
}
}
</script>
<!--[if IE]>
<script type="text/javascript">
function f(sel){
var d=document, dv;
if(d.getElementById){
for(var ii=0; ii<sel.options.length; ii++){
dv=d.getElementById(sel.options[ii].text);
if(dv)
dv.style.display=sel.options[ii].selected?"block":"none";
}
}
}
</script>
<![endif]--> <script type="text/javascript">
function showhide()
{
var radi = document.getElementById('radio1');
var row1 = document.getElementById('one');
var row2 = document.getElementById('two');
if (radi.checked == true) {
row1.style.display = '';
row2.style.display = 'none';
}
else {
row1.style.display = 'none';
row2.style.display = '';
}
}
</script>
any ideas why this wont work? http://www.engtechjobs.co.uk/candreg.php Similar TutorialsI have some code to pick a wire size and conduit size from 2 separate drop down list. Then inside the js it is evaluated to decide how many wires. My problem is I can't figure out how to make the drop down options go into the JS. I just put in an error alert to test if they were for now. Here is my code: Code: function fillcap(){
var wire = document.getElementById("wireSize");
var conduit = document.getElementById("conduitSize");
if (wire.option.length >= 10 && conduit.option.length == .5) {
windows.alert("Wire Size exceeds conduit max fill!")
}
And the html Code: <h2>Fill Capacity</h2><br>
<b>Wire Size</b><br>
<select id ="wireSize">
<option value="1">#14</option>
<option value="2">#12</option>
<option value="3">#10</option>
<option value="4">#8</option>
<option value="5">#6</option>
<option value="6">#4</option>
<option value="7">#3</option>
<option value="8">#2</option>
<option value="9">#1</option>
<option value="10">1/0</option>
<option value="20">2/0</option>
<option value="30">3/0</option>
<option value="40">4/0</option>
<option value="250">250</option>
<option value="300">300</option>
<option value="350">350</option>
<option value="400">400</option>
<option value="500">500</option>
<option value="600">600</option>
<option value="700">700</option>
<option value="750">750</option>
</select> <br>
<b>Conduit Size</b><br>
<select id="conduitSize">
<option value=".5">1/2</option>
<option value=".75">3/4</option>
<option value="1">1</option>
<option value="1.25">1-1/4</option>
<option value="1.5">1-1/2</option>
<option value="2">2</option>
<option value="2.5">2-1/2</option>
<option value="3">3</option>
<option value="3.5">3-1/2</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select><br>
<input value="Wires allowed" onclick="fillcap()" type="button">
<input type="text" name="myresultbox" id="resultbox10"> Wires<br>
Thank you for any advice. Okay, I've posted the code with just the two fields needed to solve my problem. If I type in a date of 04/16/2011 in the "sentence date" field, then click the calculate button, the date 03/05/2011 is displayed in the "Due to Reviewer" field. It subtracts 42 days from the date enetred into the "Sentence Date" field. My problem is, sometimes when I type in a date in the "Sentence Date", such as 04/16/2011, 42 days prior falls on a weekend & I need it to always be on a weekday. So with that said, is it possible to put some type on function in the code where if the date falls on a weekend (Saturday or Sunday), it will roll back & display Friday's date? Thanks again for the help! <html> <head> <script type="text/javascript"> var valid; function d2(v) { return (v<10)?("0"+v):v; } function dcheck(form) { var s = form.sent_date.value; var sent = new Date(s); var dr = form.due_rev.value var due_rev = new Date(dr); if (isNaN(due_rev)) { due_rev = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()-42); } form.sent_date.value = (sent.getFullYear()+0) + "-" + d2(sent.getMonth()+1) + "-" + d2(sent.getDate()); form.due_rev.value = (due_rev.getFullYear()+0) + "-" + d2(due_rev.getMonth()+1) + "-" + d2(due_rev.getDate()); return true; } </script> </head> <body> <form method="post" action="add.php"> </select> </br> <b>Sentence Date: MM/DD/YYYY</b> <br /> <input type="text" name="sent_date" size="30" /><br /> <p><input type="button" value="Calculate" onclick="return dcheck(this.form);"> </p> <b>Due to Reviewer:</b> <br /> <input type="text" name="due_rev" size="30" /><br /> <br> </form> </body> </html> Hi guys, I have a little experience in Javascript and would like to learn a bit more etc. I am currently working for a company which wants me create / find a image scroller using javascript and jquery. I found one which seems very suitable... I have customized the CSS and have coded it all up... The problem i'm having is that the image scroller is scrolling 3 images at a time. I would like it to scroller one at a time whilst showing all the images... Example scroller: [ pic 1] [pic 2] [pic 3] [pic 4] after scroll [pic 2] [pic 3] [pic 4] [pic 1] after next scroll [pic 3] [pic 4] [pic 1] [pic 2] and so forth. If you look at this code you will see what I mean... please help me learn and please help me complete this... im sure its just a little adjustment... but me not being too great at javascript... it makes me feel like im shooting in the dark. Thanks alot Code: <style type="text/css" media="screen">
<!--
body { font: 1em "Trebuchet MS", verdana, arial, sans-serif; font-size: 100%; }
input, textarea { font-family: Arial; font-size: 125%; padding: 7px; }
label { display: block; }
#textbanner {width:168px; height:118px; float:left;}
.infiniteCarousel {
width: 618px;
position: relative;
}
.infiniteCarousel .wrapper {
width: 618px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
height: 115px;
margin: 0 0px;
position: relative;
top: 0;
border: 1px solid #E1E1E1;
}
.infiniteCarousel ul a img {
border: 0px solid #666;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.infiniteCarousel .wrapper ul {
width: 625px; /* single item * n */
list-style-image:none;
list-style-type:none;
margin:0;
padding:0px 0px 0px 4px;
position: absolute;
top: 0px;
left: 0px;
}
.infiniteCarousel ul li {
display:block;
float:left;
padding: 0px 0px 0px 0px;
height: 85px;
width: 206px;
}
.infiniteCarousel ul li img {
-webkit-transition: border-color 20ms;
}
.infiniteCarousel ul:hover li img {
border-color: #666;
}
.infiniteCarousel ul:hover li:hover img {
border-color: #000;
}
.infiniteCarousel ul li a img {
display:block;
}
.infiniteCarousel .forward {
background-position: 0 0;
right: 0;
}
.infiniteCarousel .back {
background-position: 0 -72px;
left: 0;
}
.infiniteCarousel .forward:hover {
background-position: 0 -36px;
}
.infiniteCarousel .back:hover {
background-position: 0 -108px;
}
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
(function () {
$.fn.infiniteCarousel = function () {
function repeat(str, n) {
return new Array( n + 1 ).join(str);
}
return this.each(function () {
// magic!
var $wrapper = $('> div', this).css('overflow', 'hidden'),
$slider = $wrapper.find('> ul').width(9999),
$items = $slider.find('> li'),
$single = $items.filter(':first')
singleWidth = $single.outerWidth(),
visible = Math.ceil($wrapper.innerWidth() / singleWidth),
currentPage = 1,
pages = Math.ceil($items.length / visible);
/* TASKS */
// 1. pad the pages with empty element if required
if ($items.length % visible != 0) {
// pad
$slider.append(repeat('<li class="empty" />', visible - ($items.length % visible)));
$items = $slider.find('> li');
}
// 2. create the carousel padding on left and right (cloned)
$items.filter(':first').before($items.slice(-visible).clone().addClass('cloned'));
$items.filter(':last').after($items.slice(0, visible).clone().addClass('cloned'));
$items = $slider.find('> li');
// 3. reset scroll
$wrapper.scrollLeft(singleWidth * visible);
// 4. paging function
function gotoPage(page) {
var dir = page < currentPage ? -1 : 1,
n = Math.abs(currentPage - page),
left = singleWidth * dir * visible * n;
$wrapper.filter(':not(:animated)').animate({
scrollLeft : '+=' + left
}, 1000, function () {
// if page == last page - then reset position
if (page > pages) {
$wrapper.scrollLeft(singleWidth * visible);
page = 1;
} else if (page == 0) {
page = pages;
$wrapper.scrollLeft(singleWidth * visible * pages);
}
currentPage = page;
});
}
// 6. bind the back and forward links
$('a.back', this).click(function () {
gotoPage(currentPage - 1);
return false;
});
$('a.forward', this).click(function () {
gotoPage(currentPage + 1);
return false;
});
$(this).bind('goto', function (event, page) {
gotoPage(page);
});
// THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
$(this).bind('next', function () {
gotoPage(currentPage + 1);
});
});
};
})(jQuery);
$(document).ready(function () {
// THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
var autoscrolling = true;
$('.infiniteCarousel').infiniteCarousel().mouseover(function () {
autoscrolling = false;
}).mouseout(function () {
autoscrolling = true;
});
setInterval(function () {
if (autoscrolling) {
$('.infiniteCarousel').trigger('next');
}
}, 500);
});
</script>
</head>
<body>
<div id="textbanner"><img src="http://i46.tinypic.com/2r423yc.jpg" alt="" width="168" height="117" /></div>
<div class="infiniteCarousel">
<div class="wrapper">
<ul>
<li><a href="www.google.com"><img src="http://i49.tinypic.com/eu4x81.jpg" alt="" width="202" height="116" /></a></li>
<li><img src="http://i49.tinypic.com/2ex8ttw.jpg" alt="" width="202" height="116" /></li>
<li><img src="http://i45.tinypic.com/2gy0pkz.jpg" alt="" width="202" height="116" /></li>
</ul>
</div>
</div>
</body>
</html>
New to Javascript and been reading a lot of tutorials on the various things im trying to do with my website. One thing i cant figure out is my my menu doesnt dropdown as I want to have sublinks. I know this all has to do with my style.css. Here is the code I have, cant figure out where I got this wrong. [CODE] .menu {width:100%; height:67px; background:url(images/tail-menu.gif) 0 0 repeat-x #f00;} .menu li {float:left; font-size:1.333em; line-height:1.5em; text-transform:uppercase;} .menu li a {display:block; padding:21px 27px 22px 27px; color:#818080;} .menu li .active, .menu li a:hover {color:#fffefe; background:#f31301;} .menu .last-item a {padding:21px 32px 22px 27px; } .menu li span {width:100%; height:67px; background:url(images/tail-menu.gif); no-repeat center top;float: left} .menu li span.subhover {background-position: center bottom; cursor: pointer;} .menu li ul.subnav {list-style: none; position: absolute; left:0; top:35px; background:#f31301; margin:0; padding:0; width:170px;float:left; display:none; border: 1px solid #111} .menu li ul.subnav li{margin:0; padding:0; border-top: 1px solid #252525; border-bottom: 1px solid #444; clear: both; width: 100%;} [CODE] Any help is greatly appreciated. I have a script that was a little of mine and a little of cut and paste, i dont know why its not working. You can take the whole thing and create an html page, there are no images. Thank you for any help.... Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Javascript in use for textarea</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
// iMouseDown represents the current mouse button state: up or down
/*
lMouseState represents the previous mouse button state so that we can
check for button clicks and button releases:
if(iMouseDown && !lMouseState) // button just clicked!
if(!iMouseDown && lMouseState) // button just released!
*/
var mouseOffset = null;
var iMouseDown = false;
var lMouseState = false;
var dragObject = null;
// Demo 0 variables
var DragDrops = [];
var curTarget = null;
var lastTarget = null;
var dragHelper = null;
var tempDiv = null;
var rootParent = null;
var rootSibling = null;
Number.prototype.NaN0=function(){return isNaN(this)?0:this;}
function CreateDragContainer(){
/*
Create a new "Container Instance" so that items from one "Set" can not
be dragged into items from another "Set"
*/
var cDrag = DragDrops.length;
DragDrops[cDrag] = [];
/*
Each item passed to this function should be a "container". Store each
of these items in our current container
*/
for(var i=0; i<arguments.length; i++){
var cObj = arguments[i];
DragDrops[cDrag].push(cObj);
cObj.setAttribute('DropObj', cDrag);
/*
Every top level item in these containers should be draggable. Do this
by setting the DragObj attribute on each item and then later checking
this attribute in the mouseMove function
*/
for(var j=0; j<cObj.childNodes.length; j++){
// Firefox puts in lots of #text nodes...skip these
if(cObj.childNodes[j].nodeName=='#text') continue;
cObj.childNodes[j].setAttribute('DragObj', cDrag);
}
}
}
function mouseMove(ev){
ev = ev || window.event;
/*
We are setting target to whatever item the mouse is currently on
Firefox uses event.target here, MSIE uses event.srcElement
*/
var target = ev.target || ev.srcElement;
var mousePos = mouseCoords(ev);
// mouseOut event - fires if the item the mouse is on has changed
if(lastTarget && (target!==lastTarget)){
// reset the classname for the target element
var origClass = lastTarget.getAttribute('origClass');
if(origClass) lastTarget.className = origClass;
}
/*
dragObj is the grouping our item is in (set from the createDragContainer function).
if the item is not in a grouping we ignore it since it can't be dragged with this
script.
*/
var dragObj = target.getAttribute('DragObj');
// if the mouse was moved over an element that is draggable
if(dragObj!=null){
if(target!=lastTarget){
var oClass = target.getAttribute('overClass');
if(oClass){
target.setAttribute('origClass', target.className);
target.className = oClass;
}
}
// if the user is just starting to drag the element
if(iMouseDown && !lMouseState){
// mouseDown target
curTarget = target;
// Record the mouse x and y offset for the element
rootParent = curTarget.parentNode;
rootSibling = curTarget.nextSibling;
mouseOffset = getMouseOffset(target, ev);
for(var i=0; i<dragHelper.childNodes.length; i++) dragHelper.removeChild(dragHelper.childNodes[i]);
dragHelper.appendChild(curTarget.cloneNode(true));
dragHelper.style.display = 'block';
// set the class on our helper DIV if necessary
var dragClass = curTarget.getAttribute('dragClass');
if(dragClass){
dragHelper.firstChild.className = dragClass;
}
dragHelper.firstChild.removeAttribute('DragObj');
/*
Record the current position of all drag/drop targets related
to the element. We do this here so that we do not have to do
it on the general mouse move event which fires when the mouse
moves even 1 pixel. If we don't do this here the script
would run much slower.
*/
var dragConts = DragDrops[dragObj];
/*
first record the width/height of our drag item. Then hide it since
it is going to (potentially) be moved out of its parent.
*/
curTarget.setAttribute('startWidth', parseInt(curTarget.offsetWidth));
curTarget.setAttribute('startHeight', parseInt(curTarget.offsetHeight));
curTarget.style.display = 'none';
// loop through each possible drop container
for(var i=0; i<dragConts.length; i++){
with(dragConts[i]){
var pos = getPosition(dragConts[i]);
setAttribute('startWidth', parseInt(offsetWidth));
setAttribute('startHeight', parseInt(offsetHeight));
setAttribute('startLeft', pos.x);
setAttribute('startTop', pos.y);
}
// loop through each child element of each container
for(var j=0; j<dragConts[i].childNodes.length; j++){
with(dragConts[i].childNodes[j]){
if((nodeName=='#text') || (dragConts[i].childNodes[j]==curTarget)) continue;
var pos = getPosition(dragConts[i].childNodes[j]);
// save the width, height and position of each element
setAttribute('startWidth', parseInt(offsetWidth));
setAttribute('startHeight', parseInt(offsetHeight));
setAttribute('startLeft', pos.x);
setAttribute('startTop', pos.y);
}
}
}
}
}
if(curTarget){
// move our helper div to wherever the mouse is (adjusted by mouseOffset)
dragHelper.style.top = mousePos.y - mouseOffset.y;
dragHelper.style.left = mousePos.x - mouseOffset.x;
var dragConts = DragDrops[curTarget.getAttribute('DragObj')];
var activeCont = null;
var xPos = mousePos.x - mouseOffset.x + (parseInt(curTarget.getAttribute('startWidth')) /2);
var yPos = mousePos.y - mouseOffset.y + (parseInt(curTarget.getAttribute('startHeight'))/2);
for(var i=0; i<dragConts.length; i++){
with(dragConts[i]){
if(((getAttribute('startLeft')) < xPos) &&
((getAttribute('startTop')) < yPos) &&
((getAttribute('startLeft') + getAttribute('startWidth')) > xPos) &&
((getAttribute('startTop') + getAttribute('startHeight')) > yPos)){
/*
our target is inside of our container so save the container into
the activeCont variable and then exit the loop since we no longer
need to check the rest of the containers
*/
activeCont = dragConts[i];
// exit the for loop
break;
}
}
}
if(activeCont){
var beforeNode = null;
for(var i=activeCont.childNodes.length-1; i>=0; i--){
with(activeCont.childNodes[i]){
if(nodeName=='#text') continue;
// if the current item is "After" the item being dragged
if(
curTarget != activeCont.childNodes[i] &&
((getAttribute('startLeft') + getAttribute('startWidth')) > xPos) &&
((getAttribute('startTop') + getAttribute('startHeight')) > yPos)){
beforeNode = activeCont.childNodes[i];
}
}
}
// the item being dragged belongs before another item
if(beforeNode){
if(beforeNode!=curTarget.nextSibling){
activeCont.insertBefore(curTarget, beforeNode);
}
} else {
if((curTarget.nextSibling) || (curTarget.parentNode!=activeCont)){
activeCont.appendChild(curTarget);
}
}
// make our drag item visible
if(curTarget.style.display!=''){
curTarget.style.display = '';
}
} else {
if(curTarget.style.display!='none'){
curTarget.style.display = 'none';
}
}
}
lMouseState = iMouseDown;
// mouseMove target
lastTarget = target;
lMouseState = iMouseDown;
return false;
}
function mouseUp(ev){
if(curTarget){
// hide our helper object - it is no longer needed
dragHelper.style.display = 'none';
if(curTarget.style.display == 'none'){
if(rootSibling){
rootParent.insertBefore(curTarget, rootSibling);
} else {
rootParent.appendChild(curTarget);
}
}
// make sure the drag item is visible
curTarget.style.display = '';
}
curTarget = null;
iMouseDown = false;
}
function mouseDown(){
iMouseDown = true;
if(lastTarget){
return false;
}
}
document.onmousemove = mouseMove;
document.onmousedown = mouseDown;
document.onmouseup = mouseUp;
window.onload = function(){
// Create our helper object that will show the item while dragging
dragHelper = document.createElement('DIV');
dragHelper.style.cssText = 'position:absolute;display:none;';
CreateDragContainer(
document.getElementById('DragContainer1'),
document.getElementById('DragContainer2'),
document.getElementById('DragContainer3')
);
document.body.appendChild(dragHelper);
}
</script>
<style type="text/css">
* {
padding:0px;
margin:0px;
}
#DragContainer1 { float:left;
width:200px;
padding:8px;
background-color:#FF0000;
height:600px;
}
#DragContainer3 { float:right;
width:200px;
padding:8px;
background-color:#000000;
height:600px;
}
#DragContainer2 { margin-right:215px;
margin-left:215px;
padding:8px;
background-color:#CCCCCC;
height:600px;
}
.linebox {
width:150px;
height:50px;
border:1px solid #FFFFFF;
background-color:#006600;
}
.linebox h1 {
font-family:"Myriad Pro";
font-size:12px;
}
</style>
</head>
<body>
<div id="DragContainer1">
<div class="linebox" id="Item1" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 1</h1></div>
<div class="linebox" id="Item2" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 2</h1></div>
<div class="linebox" id="Item3" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 3</h1></div>
</div>
<div id="DragContainer3">
<div class="linebox" id="Item4" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 4</h1></div>
<div class="linebox" id="Item5" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 5</h1></div>
<div class="linebox" id="Item6" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 6</h1></div>
</div>
<div id="DragContainer2">
<div class="linebox" id="Item7" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 7</h1></div>
<div class="linebox" id="Item8" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 8</h1></div>
<div class="linebox" id="Item9" overClass="OverDragBox" dragClass="DragDragBox"><h1>Box 9</h1></div>
</div>
</body>
</html>
Hi all I'm a real newbie to Java script, I've literally been teaching myself for about 2 days now, but I've come across a bit of a problem which I'm sure is easy to fix so I was hoping for some pointers. Heres the problem: What I'm trying to do is create a document which allows you to select a size of box from a drop down menu, and then select a size of product to go into the box on a second drop down. The products on the second drop down menu will be allocated based on the box size that you've selected to make sure that you can only choose products which will fit in the box you've selected. In order to do this I've set up a 2D array, which lists each product and which boxes they will fit in using 0 for no and 1 for yes. When you select a box size from the drop down a value appears in a text box next to it (1, 2, 3, or 4) and what I need to do is use the number which appears in this text box to pull data from the array to populate the next drop down list. i.e. If option 2 appears from the first drop down selection then the second drop down should be populated with data from column 2 of array (In this example 1212, 1515, and 2020 would be shown in the second drop down) Im having trouble with the Java script to pull the values from the html text box in order to manipulate the array. If you look at the function 'top_biochill_addOption_list()' you will see that the second drop is populated here from row [itop2][3] of the array, which means the second drop down is permenantly populated as if option 3 had been selected from the first drop down. I need to get the value selected from the first drop down as a variable and replace the '3' in the above statement with that variable to get this to work but I have no idea how to go about that. Hopefully all will become clear when you see the code. As I say, I am very new to Javascript so I'm sure this code is probably messy and inefficient, but with that in mind I'd appreciate replies being in simplified terms so I can understand what you're getting at, or if anything gets re-written then a brief explaination of whats going on would be handy so I can understand what the code is actually doing! Thanks Code:
<html>
<head>
<script type="text/javascript">
var linebreak = "<br />";
//Code to prints out the current product matrix
function print_top_biochill_list(){
var topx=0
var topy=0
for (topi=0;topi<top_biochill.length;topi++)
{
document.write(top_biochill[topx][topy]+" "+top_biochill[topx][topy+1]+" "+top_biochill[topx][topy+2]+" "+top_biochill[topx][topy+3]+" "+top_biochill[topx][topy+4]+"<br />");
var topx=topx+1;}}
//Code to create Drop Down Menu to select top Biochill
function top_biochill_addOption(selectbox,text,value ){
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
selectbox.options.add(optn);}
//Code to populate Top Biochill Drop Down Menu based on which size EPS is selected
function top_biochill_addOption_list(selectbox){
var itop2=0
for (var itop=0; itop < top_biochill.length;++itop){
if (top_biochill[itop2][3]==1){
top_biochill_addOption(document.top_biochill_drop_list.top_biochill_list, top_biochill[itop][0], top_biochill[itop][0]);
itop2=itop2+1
}}}
function addtop_biochill(){
}
</script>
</head>
<body onLoad="addtop_biochill();top_biochill_addOption_list()";>
<script type="text/javascript">
//Creates an array to describe top biochill
var top_biochill = new Array();
{
//0=Name, 1=EPS10, 2=EPS15, 3=EPS30, 4=EPS45
top_biochill[0] = new Array(1212,1,1,1,1 );
top_biochill[1] = new Array(1515,1,1,1,1 );
top_biochill[2] = new Array(2020,0,1,1,1 );
top_biochill[3] = new Array(3015,0,0,1,1 );
top_biochill[4] = new Array(3020,0,0,0,1 );
top_biochill[5] = new Array(3040,0,0,0,1 );
}
//Runs the prints the matrix code
print_top_biochill_list();
</script>
<!--Select EPS Size Drop Down Menu-->
<form name="box_size" onsubmit="CheckForm()">
<select name="box_size_jump_menu" onchange="document.box_size.EPSshowvalue.value=this.value">
<option value=0>Please select a Box Size</option>
<option value=1>EPS 10</option>
<option value=2>EPS 15</option>
<option value=3>EPS 30</option>
<option value=4>EPS 45</option>
</select>
<input type="number" name="EPSshowvalue">
<script type="text/javascript">
top_biochill_addOption_list();
</script>
</form>
<!--Select Top Biochill Drop Down Menu-->
<FORM name="top_biochill_drop_list" onsubmit="CheckForm()">
<SELECT NAME="top_biochill_list" onchange="document.top_biochill_drop_list.top_biochill_showvalue.value=this.value">
<Option value="" >Select Biochill</option>
</SELECT>
<input type="text" name="top_biochill_showvalue"><br>
</form>
</body>
</html>
Hello I have several issues with my multilevel drop down menu The First issue is : the page has 2 iframes (one has the horizontal multilevel drop down menu on the top) the below iframe has my site address Now, when i hover over the menu it does not open or expand but when i open just the menu without any iframes it does This clearly means that the menu is not coming out of the iframe Please help me bring it on top of everything of the page Note: i have placed the menu in one iframe and a page opens below it in another iframe. The Second issue is : I want the navigation bar that is the multilevel drop down menu to be editable Which means i have a blog and a forum on my site but my visitor wants that the blog should not appear there and another link to play games should be there and hence he/she can edit it And please also try to make it work on cookies so that the user info and preferences are saved in cookies and whenever he/she comes back they see the page their way. For you: I would like to tell you that IdeaLab has launched a Twitter Advertising, Widget and Search platform and the first 1000 people are getting $100 go to tweetup.com Please help me, it will be really appreciable. Thank you very much in advance! Hi, I managed to make a jquery drop down navigation system. I'm needing an opinion on the code as I suspect it could be alot cleaner and more efficient. A couple of niggling usability problems bug me - when a main link is in its active state and it is clicked on again it will slide up and then down again - I'd prefer it if it just stayed down and didn't move anywhere. The major thing that bugs me is if you think it breaks usability etiquette becuase the buttons move everywhere. If you think this is the case I will not use it. I understand there are forums for usability testing but if anyone has their opinions I'd be happy to hear them. You can view the navigation system he http://www.jrcreativedesign.co.uk/nav.html Thanks very much for your time and consideration. For some reason I can not get this code to dump the information I type in into the mysql database...I'm sure I've missed something but can't seem to figure it out on my own. The mysql username & password are correct on my end & the fields match the mysql table column names. Do I have the code to connect & insert the fields into the mysql database in the correct place?? <?php # Page: add.php ########################## # Report all errors ########################## ini_set('display_errors',1); error_reporting(E_ALL); if( isset($_POST) && !empty($_POST) ) { # db connection settings ########################## # server IP $host = "localhost"; # sql user $user = "user"; # sql pw $pw = "mypassword"; # sql database $db = "psrflow"; # connect to db server ########################## $conn = mysql_connect( $host, $user, $pw ) or die( "Error! Unable to connect to database server: <br/>" . mysql_error() ); # connect to db ########################## $rs = mysql_select_db( $db, $conn ) or die( "Error! Unable to connect to database: <br/>" . mysql_error() ); # get submitted values & escape the text string foreach($_POST as $key=>$value) { ${$key}=mysql_real_escape_string($value); } $strSQL = "INSERT INTO psrinfo ( offender_fname, offender_lname, location, docket, officer, status, sent_date, assgn_date, interv_date, due_rev, due_suspo, due_clerk, due_attny, due_judge ) VALUES ( '" . $offender_fname . "', '" . $offender_lname . "', '" . $location . "', '" .$docket . "', '" .$officer ."', '" .$status ."', '".$sent_date ."', '".$assgn_date ."', '".$interv_date ."', '".$due_rev ."', '".$due_suspo ."', '".$due_clerk ."', '".$due_attny ."', '".$due_judge ."')"; # execute db insert ########################## if (!mysql_query( $strSQL, $conn )){ echo( "Unable to save data to database: <br/>" . mysql_error() . "<br/>" . $strSQL . "</span><br/>" ); } else{ header( "Location: index.html" ); exit; } } ?> <html> <head> <title>My Title</title> <script type="text/javascript"> var valid; function dcheck(form) { var a = form.assgn_date.value; var s = form.sent_date.value; var i = form.interv_date.value; var dr = form.due_rev.value var su = form.due_suspo var clk = form.due_clerk var att = form.due_attny var jdg = form.due_judge var assn = new Date(a); var sent = new Date(s); var intv = new Date(i); var due_rev = new Date(dr); var due_suspo = new Date(su); var due_clerk = new Date(clk); var due_attny = new Date(att); var due_judge = new Date(jdg); if (isNaN(assn)) { assn = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+7); } if (isNaN(sent)) { sent = new Date(assn.getFullYear(),assn.getMonth(),assn.getDate()-7); } if (isNaN(intv)) { intv = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+14); } if (isNaN(due_rev)) { due_rev = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+15); } if (isNaN(due_suspo)) { due_suspo = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+16); } if (isNaN(due_clerk)) { due_clerk = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+17); } if (isNaN(due_attny)) { due_attny = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+18); } if (isNaN(due_judge)) { due_judge = new Date(sent.getFullYear(),sent.getMonth(),sent.getDate()+19); } form.assgn_date.value = (assn.getMonth()+1) + "/" + assn.getDate() + "/" + assn.getFullYear(); form.sent_date.value = (sent.getMonth()+1) + "/" + sent.getDate() + "/" + sent.getFullYear(); form.interv_date.value = (intv.getMonth()+1) + "/" + intv.getDate() + "/" + intv.getFullYear(); form.due_rev.value = (due_rev.getMonth()+1) + "/" + due_rev.getDate() + "/" + due_rev.getFullYear(); form.due_suspo.value = (due_suspo.getMonth()+1) + "/" + due_suspo.getDate() + "/" + due_suspo.getFullYear(); form.due_clerk.value = (due_clerk.getMonth()+1) + "/" + due_clerk.getDate() + "/" + due_clerk.getFullYear(); form.due_attny.value = (due_attny.getMonth()+1) + "/" + due_attny.getDate() + "/" + due_attny.getFullYear(); form.due_judge.value = (due_judge.getMonth()+1) + "/" + due_judge.getDate() + "/" + due_judge.getFullYear(); return true; } </script> <style type="text/css"> body {background-color: #ffffff; margin-top: 60px;} </style> </head> <body> <form action="" method="get" onsubmit="return dcheck(this);"> <b>Docket No:</b> <br /> <input type="text" name="docket" size="30" /><br /> <b>First Name:</b> <br /> <input type="text" name="offender_fname" size="30" /><br /> <b>Last Name:</b> <br /> <input type="text" name="offender_lname" size="30" /><br /> <b>Status:</b> <br /> <input type="text" name="status" size="30" /><br /> <b>Location:</b> <br /> <input type="text" name="location" size="30" /><br /> <b>Officer:</b> <br /> <input type="text" name="officer" size="30" /><br /> <b>Sentence Date MM/DD/YYYY:</b /> <br /> <input type="text" size = "15" name="sent_date"> <br /> <b>Assign Date:</b>    <br /> <input type="text" size = "15" name="assgn_date"> <br /> <b>Invterview Date:</b>    <br /> <input type="text" size = "15" name="interv_date"> <br /> <b>Due to Reviewer:</b>    </br> <input type="text" size = "15" name="due_rev"> <br /> <b>Due to SUSPO:</b>    </br> <input type="text" size = "15" name="due_suspo"> <br /> <b>Due to Clerk:</b>    </br> <input type="text" size = "15" name="due_clerk"> <br /> <b>Due to Attorney:</b>    </br> <input type="text" size = "15" name="due_attny"> <br /> <b>Due to Judge:</b>    </br> <input type="text" size = "15" name="due_judge"> <br /> <br> <input type="button" value="Calculate" onclick="return dcheck(this.form);"> <input type="button" value="Reset" onclick="this.form.reset()"> <input type="submit" value="Submit" /> </form> </body> </html> I am working on a website that involves a pizza. I have a drop down box with the following options: small, medium, large, and extra large. When the user selects small the topping price is $0.75 each, when the user selects medium the topping price is $1.00 each, when the user selects large the topping price is $1.25 each, and when the user selects extra large the topping price is $1.25 each. I the problem is no matter what size the user selects the topping price is always $0.75. Here is code that goes with the drop down box : Code: <td height="49" align="right"><label for="Pizza_Size">Size</label>
<select name="Pizza_Size" id="Pizza_Size" onchange = "SetToppingPrice()" />
<option value="Small_Pizza">Small ($4.99)</option>
<option value="Medium_Pizza">Medium ($5.99)</option>
<option value="Large_Pizza">Large ($7.99)</option>
<option value="X_Large_Pizza">X-Large ($10.99)</option>
</select></td>
Here is the Javascript code: Code: // JavaScript Document
function SetToppingPrice() {
var Pizza_Topping_Price = document.getElementById("Pizza_Size");
divOutput = document.getElementById("Display_Topping_Price");
if(Pizza_Topping_Price = "Small_Pizza") {
divOutput.innerHTML = "$0.75 per topping";}
else if (Pizza_Topping_Price = "Medium_Pizza") {
divOutput.innerHTML = "$1.00 per topping";}
else if (Pizza_Topping_Price = "Large_Pizza") {
divOutput.innerHTML = "$1.25 per topping";}
else if (Pizza_Topping_Price = "X_Large_Pizza") {
divOutput.innerHTML = "$1.50 per topping";}
}
Any advice is greatly appreciated. Hi, I have the following code for drag and drop objects in any page. My target: I want to be able to drag and drop the advertisement images that come on top of the page. It works most of the time, but sometime page crashes. I use google chrome as a bookmarklet. Code: Code: javascript:var d=document,b=d.body,i="innerHTML",s="style",p="position",a="absolute",r="relative",w1="offsetWidth",w2="width",h1="offsetHeight",h2="height",t1="offsetTop",t2="top",l1="offsetLeft",l2="left",drag=false;function down(e){drag=true;z=event.srcElement;z[s][p]=r;x=event.clientX;y=event.clientY;zx=z[l1];zy=z[t1];d.onmousemove=move}function up(e){drag=false;}function move(e){if(drag){z[s][l2]=zx+event.clientX-x;z[s][t2]=zy+event.clientY-y}}document.onmousedown=down;document.onmouseup=up;
Any improvements in the code is appreciated. Does anybody have a advanced better code, because I am just medium in javascript. Hi, I am currently working in mail client project. The mails are displayed in the html table. I have an requirement to drag and drop the mails from the Inbox to another folder. Can you please suggest how to proceed with this. Thanks in advance. Regards, Anne. Hi All, I am really stumped. I am not sure why it's not working. Basically, selecting a country will pre-populate the state field for both billing and shipping sections. Please help! Also, when copying the billing info from shipping, the state field doesn't seem to copy over. I have attached the entire code as a text file (part1 + part2 = complete code). Thanks! Hi Guys, A couple of years ago I came across a Javascript drop down search facility which I used for an eBay shop I built. I don't really have any knowledge at all of Javascript but I did manage to get it to work the way I wanted, somehow! Basically at the moment with the drop down you have to select the product type, your make of vehicle and then your model. This then searches the ebay shop for any relevant listings. However, I now want to add a forth drop down box which also searches the engine size. How would I go about adding another drop down list? Any help would be much appreciated. I've had to split the code into two lots and there is too many characters to fit in one thread! Code: <script type="text/javascript">
product = new Array ("CATALYTIC-CONVERTER","CENTRAL-SILENCER","FRONT-PIPE","Rear-Assembly");
make = new Array ("ALFA_ROMEO","AUDI","BMW","CITROEN","DAEWOO","FIAT","FORD","HONDA","HYUNDAI","JAGUAR","LAND_ROVER","LEXUS","MAZDA","MERCEDES","MG","MITSUBISHI","NISSAN","PEUGEOT","RENAULT","ROVER","SAAB","SEAT","SKODA","SUBARU","SUZUKI","TOYOTA","VAUXHALL","VOLKSWAGEN","VOLVO");
ALFA_ROMEO = new Array ("ALFA ROMEO 145", "145", "ALFA ROMEO 146", "146", "ALFA ROMEO 147", "147", "ALFA ROMEO 155", "155", "ALFA ROMEO 156", "156", "ALFA ROMEO 164", "164","ALFA ROMEO 166", "166","ALFA ROMEO 75", "75","ALFA ROMEO 33","33","ALFA ROMEO GTV", "GTV","ALFA ROMEO SPIDER","SPIDER");
AUDI = new Array ("AUDI 80","80","AUDI 90","90","AUDI 100","100","AUDI 200","200","AUDI A2","A2","AUDI A3","A3","AUDI A4","A4","AUDI A6","A6","AUDI A8","A8","AUDI CABRIOLET","AUDI COUPE","COUPE","AUDI S3","S3","AUDI S4","S4","AUDI S6","S6", "AUDI S8","S8","AUDI TT","TT");
BMW = new Array ("BMW 316","316","BMW 318","318","BMW 320","320","BMW 323","323","BMW 325","325","BMW 328","328","BMW 518","518","BMW 520","520","BMW 523","523","BMW 525","525","BMW 528","528","BMW 530","530","BMW 535","535","BMW 540","540","BMW 728","728","BMW 730","730","BMW 735","735","BMW 750","750","BMW 840","840","BMW 850","850","BMW M3","M3","BMW M5","M5","BMW Z3","Z3","BMW MINI","MINI");
CITROEN = new Array("CITROEN AX","AX","CITROEN BERLINGO","BERLINGO","CITROEN BX","BX","CITROEN C15","C15","CITROEN C5","C5","CITROEN DISPATCH","DISPATCH","CITROEN RELAY","RELAY","CITROEN SAXO","SAXO","CITROEN SYNERGIE","SYNERGIE","CITROEN XANTIA","XANTIA","CITROEN XM","XM","CITROEN XSARA","XSARA","CITROEN ZX","ZX");
DAEWOO = new Array("DAEWOO ESPERO","ESPERO","DAEWOO KORANDO","KORANDO","DAEWOO LANOS","LANOS","DAEWOO LEGANZA","LEGANZA","DAEWOO MATIZ","MATIZ","DAEWOO MUSSO","MUSSO","DAEWOO","NEXIA","DAEWOO","NUBIRA","DAEWOO TACUMA","TACUMA");
FIAT = new Array("FIAT BARCHETTA","BARCHETTA","FIAT BRAVA","BRAVA","FIAT BRAVO","BRAVO","FIAT CINQUECENTO","CINQUECENTO","FIAT COUPE","COUPE","FIAT CROMA","CROMA","FIAT DOBLO","DOBLO","FIAT DUCATO","DUCATO","FIAT FIORINO","FIORINO","FIAT MAREA","MAREA","FIAT MULTIPLA","MULTIPLA","FIAT PANDA","PANDA","FIAT PUNTO","PUNTO","FIAT SCUDO","SCUDO","FIAT SEICENTO","SEICENTO","FIAT TEMPRA","TEMPRA","FIAT TIPO","TIPO","FIAT ULYSSE","ULYSSE","FIAT UNO","UNO");
FORD = new Array("FORD COUGAR","COUGAR","FORD ESCORT","ESCORT","FORD EXPLORER","EXPLORER","FORD FIESTA","FIESTA","FORD FOCUS","FOCUS","FORD GALAXY","GALAXY","FORD GRANADA","GRANADA","FORD KA","KA","FORD MAVERICK","MAVERICK","FORD MONDEO","MONDEO","FORD ORION","ORION","FORD PROBE","PROBE","FORD PUMA","PUMA","FORD SCORPIO","SCORPIO","FORD SIERRA","SIERRA","FORD TOURNEO","TOURNEO","FORD TRANSIT","TRANSIT");
HONDA = new Array("HONDA ACCORD","ACCORD","HONDA CIVIC","CIVIC","HONDA CONCERTO","CONCERTO","HONDA CRV","CRV","HONDA HRV","HRV","HONDA INTEGRA","INTEGRA","HONDA JAZZ","JAZZ","HONDA LEGEND","LEGEND","HONDA PRELUDE","PRELUDE","HONDA SHUTTLE","SHUTTLE","HONDA STREAM","STREAM");
HYUNDAI = new Array("HYUNDAI ACCENT","ACCENT","HYUNDAI ATOS","ATOS","HYUNDAI COUPE","COUPE","HYUNDAI LANTRA","LANTRA","HYUNDAI PONY","PONY","HYUNDAI S COUPE","S COUPE","HYUNDAI SONATA","SONATA");
JAGUAR = new Array("JAGUAR S TYPE","S TYPE","JAGUAR XJ12","XJ12","JAGUAR XJ6","XJ6","JAGUAR XJ8","XJ8","JAGUAR XJR","XJR","JAGUAR XJS","XJS","JAGUAR XK8","XK8");
LAND_ROVER = new Array("LAND-ROVER 110","110","LAND-ROVER 90","90","LAND-ROVER DEFENDER","DEFENDER","LAND-ROVER DISCOVERY","DISCOVERY","LAND-ROVER FREELANDER","FREELANDER","RANGE-ROVER","RANGE ROVER");
LEXUS = new Array("LEXUS ES","ES SERIES","LEXUS GS","GS SERIES","LEXUS IS","IS SERIES","LEXUS LS","LS SERIES","LEXUS LX","LX SERIES","LEXUS RX","RX SERIES","LEXUS SC","SC SERIES","LEXUS SOARER","SOARER");
MAZDA = new Array("MAZDA 121","121","MAZDA 2","2","MAZDA 323","323","MAZDA 323F","323F","MAZDA 6","6","MAZDA 616","616","MAZDA 626","626","MAZDA 929","929","MAZDA DEMIO","DEMIO","MAZDA MPV","MPV","MAZDA MX3","MX3","MAZDA MX5","MX5","MAZDA MX6","MX6","MAZDA PREMACY","PREMACY","MAZDA RX7","RX7","MAZDA RX8","RX8","MAZDA TRIBUTE","TRIBUTE","MAZDA XEDOS","XEDOS");
MERCEDES = new Array("MERCEDES 180","180","MERCEDES 190","190","MERCEDES 200","200","MERCEDES 220","220","MERCEDES 230","230","MERCEDES 240","240","MERCEDES 280","280","MERCEDES 300","300","MERCEDES 320","320","MERCEDES 400","400","MERCEDES 420","420","MERCEDES 430","430","MERCEDES 500","500","MERCEDES 600","600","MERCEDES A CLASS","A CLASS","MERCEDES C CLASS","C CLASS","MERCEDES E CLASS","E CLASS","MERCEDES G WAGON","G WAGON","MERCEDES ML","ML","MERCEDES SPRINTER","SPRINTER","MERCEDES V","V","MERCEDES VITO","VITO");
MG = new Array("MG 25","25","MG MGF","MGF","MG RV8","RV8","MG TF","TF","MG ZR","ZR","MG ZS","ZS","MG ZT","ZT");
MITSUBISHI = new Array("MITSUBISHI 3000","3000","MITSUBISHI CARISMA","CARISMA","MITSUBISHI COLT","COLT","MITSUBISHI ECLIPSE","ECLIPSE","MITSUBISHI EVO","EVO","MITSUBISHI FTO","FTO","MITSUBISHI GALANT","GALANT","MITSUBISHI GTO","GTO","MITSUBISHI L200","L200","MITSUBISHI L300","L300","MITSUBISHI L400","L400","MITSUBISHI LANCER","LANCER","MITSUBISHI PAJERO","PAJERO","MITSUBISHI SHOGUN","SHOGUN","MITSUBISHI SIGMA","SIGMA","MITSUBISHI SPACE STAR","SPACE STAR","MITSUBISHI SPACEWAGON","SPACEWAGON");
NISSAN = new Array("NISSAN 100 NX","100 NX","NISSAN 200 SX","200 SX","NISSAN 300 ZX","300 ZX","NISSAN 350 Z","350 Z","NISSAN 1800 SX","1800 SX","NISSAN ALMERA","ALMERA","NISSAN BLUEBIRD","BLUEBIRD","NISSAN CABSTAR","CABSTAR","NISSAN CHERRY","CHERRY","NISSAN MICRA","MICRA","NISSAN MAXIMA","MAXIMA","NISSAN PRIMERA","PRIMERA","NISSAN SERENA","SERENA","NISSAN SKYLINE","SKYLINE","NISSAN SUNNY","SUNNY","NISSAN TERRANO","TERRANO","NISSAN X TRAIL","X TRAIL");
PEUGEOT = new Array("PEUGEOT 106","106","PEUGEOT 107","107","PEUGEOT 205","205","PEUGEOT 206","206","PEUGEOT 306","306","PEUGEOT 307","307","PEUGEOT 309","309","PEUGEOT 405","405","PEUGEOT 406","406","PEUGEOT 407","407","PEUGEOT 605","605","PEUGEOT 607","607","PEUGEOT 806","806","PEUGEOT 807","807","PEUGEOT 1007","1007","PEUGEOT BOXER","BOXER","PEUGEOT EXPERT","EXPERT","PEUGEOT PARTNER","PARTNER");
RENAULT = new Array("RENAULT CLIO","CLIO","RENAULT ESPACE","ESPACE","RENAULT KANGOO","KANGOO","RENAULT LAGUNA","LAGUNA","RENAULT MEGANE","MEGANE","RENAULT SAFRANE","SAFRANE","RENAULT SCENIC","SCENIC","RENAULT R19","R19","RENAULT R21","R21");
ROVER = new Array("ROVER 111","111","ROVER 114","114","ROVER 211","211","ROVER 214","214","ROVER 216","216","ROVER 218","218","ROVER 220","220","ROVER 25","25","ROVER 323","323","ROVER 414","414","ROVER 416","416","ROVER 420","420","ROVER 45","45","ROVER 618","618","ROVER 620","620","ROVER 623","623","ROVER 75","75","ROVER 820","820","ROVER 825","825","ROVER 827","827","ROVER MAESTRO","MAESTRO","ROVER METRO","METRO","ROVER MG","MG","ROVER MGF","MGF","ROVER MINI","MINI","ROVER MONTEGO","MONTEGO","ROVER STREETWISE","STREETWISE");
SAAB = new Array("SAAB 9-3","9-3","SAAB 9-4","9-4","SAAB 9-5","9-5","SAAB 90","90","SAAB 99","99","SAAB","900","SAAB 9000","9000");
SEAT = new Array("SEAT ALHAMBRA","ALHAMBRA","19AUK35","ALTEA","SEAT AROSA","AROSA","SEAT CORDOBA","CORDOBA","SEAT IBIZA","IBIZA","SEAT INCA","INCA","SEAT LEON","LEON","SEAT MALAGA","MALAGA","SEAT MARBELLA","MARBELLA","SEAT TERRA","TERRA","SEAT TOLEDO","TOLEDO");
SKODA = new Array("SKODA FABIA","FABIA","SKODA FAVORIT","FAVORIT","SKODA FELICIA","FELICIA","SKODA OCTAVIA","OCTAVIA","SKODA SUPERB","SUPERB","SKODA TAVRIA","TAVRIA");
SUBARU = new Array("SUBARU FORESTER","FORESTER","SUBARU IMPREZA","IMPREZA","SUBARU JUSTY","JUSTY","SUBARU LEGACY","LEGACY","SUBARU LIBERO","LIBERO","SUBARU SVX","SVX","SUBARU VIVIO","VIVIO");
SUZUKI = new Array("SUZUKI ALTO","ALTO","SUZUKI BALENO","BALENO","SUZUKI CARRY","CARRY","SUZUKI GRAND VITARA","GRAND VITARA","SUZUKI JIMMY","JIMMY","SUZUKI ESTEEM","ESTEEM","SUZUKI IGNIS","IGNIS","SUZUKI LIANA","LIANA","SUZUKI SAMURAI","SAMURAI","SUZUKI SWIFT","SWIFT","SUZUKI VITARA","VITARA","SUZUKI WAGON","WAGON");
TOYOTA = new Array("TOYOTA AVENSIS","AVENSIS","TOYOTA CAMRY","CAMRY","TOYOTA CARINA","CARINA","TOYOTA CELCIA","CELICA","TOYOTA COROLLA","COROLLA","19S35","ESTIMA","TOYOTA HI-ACE","HI-ACE","TOYOTA HI-LUX","HI-LUX","TOYOTA LAND CRUISER","LAND CRUISER","TOYOTA MR2","MR2","TOYOTA PASEO","PASEO","TOYOTA PICNIC","PICNIC","TOYOTA PREVIA","PREVIA","TOYOTA PRIUS","PRIUS","TOYOTA RAV 4","RAV 4","TOYOTA SPACECRUISER","SPACECRUISER","TOYOTA STARLET","STARLET","TOYOTA SUPRA","SUPRA","TOYOTA YARIS","YARIS");
</script>
<script type="text/javascript">
VAUXHALL = new Array("VAUXHALL ASTRA","ASTRA","VAUXHALL BRAVA","BRAVA","VAUXHALL CALIBRA","CALIBRA","VAUXHALL CAVALIER","CAVALIER","VAUXHALL COMBO","COMBO","VAUXHALL CORSA","CORSA","VAUXHALL FRONTERA","FRONTERA","VAUXHALL MERIVA","MERIVA","VAUXHALL MONTERRY","MONTERRY","VAUXHALL NOVA","NOVA","VAUXHALL OMEGA","OMEGA","VAUXHALL SENATOR","SENATOR","VAUXHALL SIGNUM","SIGNUM","VAUXHALL SINTRA","SINTRA","VAUXHALL TIGRA","TIGRA","VAUXHALL VECTRA","VECTRA","VAUXHALL ZAFIRA","ZAFIRA");
VOLKSWAGEN = new Array("VOLKSWAGEN BEETLE","BEETLE","VOLKSWAGEN BORA","BORA","VOLKSWAGEN CADDY","CADDY","VOLKSWAGEN CARAVELLE","CARAVELLE","VOLKSWAGEN CORRADO","CORRADO","VOLKSWAGEN GOLF","GOLF","VOLKSWAGEN JETTA","JETTA","VOLKSWAGEN LUPO","LUPO","VOLKSWAGEN PASSAT","PASSAT","VOLKSWAGEN POLO","POLO","VOLKSWAGEN SANTANA","SANTANA","VOLKSWAGEN SCIROCCO","SCIROCCO","VOLKSWAGEN SHARAN","SHARAN","VOLKSWAGEN TRANSPORTER","TRANSPORTER","VOLKSWAGEN VENTO","VENTO");
VOLVO = new Array("VOLVO 240","240","VOLVO 340","340","VOLVO 440","440","VOLVO 460","460","VOLVO 480","480","VOLVO 740","740","VOLVO 760","760","VOLVO 850","850","VOLVO 940","940","VOLVO 960","960","VOLVO C70","C70","VOLVO S40","S40","VOLVO S60","S60","VOLVO S70","S70","VOLVO S80","S80","VOLVO S90","S90","VOLVO V40","V40","VOLVO V50","V50","VOLVO V70","V70","VOLVO V90","V90");
function writeoptions(selectname)
{
var arr = selectname;
var k=arr.length;
for (i=0; i<k; i++)
{
if (arr[i] == "REAR_SILENCER")
{
document.write ("<OPTION value=\"\">"+arr[i]+"</OPTION>");
}
else
{
document.write ("<OPTION value="+arr[i]+">"+arr[i]+"</OPTION>");
}
}
}
function writeselect(selectedoption)
{
var opt = selectedoption;
var optarray = window[opt]
var frm1 = document.myForm;
frm1.model.disabled=(frm1.make.selectedIndex==0 || frm1.product.selectedIndex==0);
frm1.model.selectedIndex = 0;
frm1.model.length = 1;
count=1
if(frm1.make.selectedIndex > 0) for(i=0;i<optarray.length;i=i+2)
{
frm1.model.options[count] = new Option(optarray[i+1],optarray[i]);
count++
}}
</script>
Okay everyone, new here, of course, and as much as I hate to be one of those people that don't really know much about a topic at hand and gratuitously seek out the help of those who do, here I am. The upshot is that it's probably something really easy to answer for those who know Javascript already. I've tried figuring this out but I'm at a loss. I can manage pretty well with CSS, messing around and playing with values to figure out what I need, but I've taken a look at the Javascript and it's completely unapproachable for me. I used a website, http://www.mycssmenu.com/ to create a really nifty dropdown menu, which has a tree structure in Javascript as well as collapse and expand buttons. The great thing is that, for those with Javascript disabled, it still fully works as a CSS drop-down menu. But I've been asked to modify it. Right now, you click and that's how things expand. But I've been asked to make it so that it will expand simply on hover.And I don't know what to do at all. Of course I know how to change the colors of the particular fields when you hover, through CSS, but to make it expand simply on hover? Think anyone can give me some pointers or a bit of help? The website in question is here Psiholog Popa Anca. Great job on the colors though, eh? Let me know! I don't know anything about javascript so the way I word this might be a bit confusing. I am making an online store using corecommerce but I am having difficulty finding a code that will allow my visitors to determine how many items they see per pg. The options would be: 25 items 50 items 75 items View All. I have been playing around with codes that I find.. but like I said earlier, I know absolutely NOTHING about javascript. Can anyone help me out by either giving me the code or pointing me to a tutorial or anything! PLEASE! thx a bunch P.S. if you know of a program or software thats also great too! Hi guys. I have been scowering high and low for code to create a Java drop down menu bar for my site. I want it to be something like this: http://javascript-array.com/scripts/...rop_down_menu/ but want to insert pictures into it, for each heading, to create a new looking bar if thats possible. Can you do a mouseover with them also, as i currently have one set up, to change text colour (2 different images per button) but am unsure of the code. Thanks in advance. Hi, I'm doing a project for college where i have create a game in which images must be dragged-and-dropped into a certain order. The game should: * Be web-based, using client-side JavaScript * Include At LEAST FIVE moveable images * Randomise the positions of the images at start-up * Check the positions of the images and notify the user when they are in the correct order * Record and display the time taken to sort the images All of these requirements are working, i have div tags set up with borders around them, so that the user knows where to place the images. The thing i would like to do is when an image is dragged say within 20px of a div that the image snaps to the div...can anybody suggest a way to do this or perhaps a code suggestion. Code: <html>
<head>
<script language="javascript" type="text/javascript">
// cursor drag and drop variables
var IE = document.all;
var selectedImage = null;
var tx = 0;
var ty= 0;
var x = 0;
var y = 0;
//change names
var rand=null;
var myround=null;
//timer variables
var c= 0;
var t;
var timer_is_on= null
// Where images are supposed to go
var image1 = new Array ("804px","70px");
var image2 = new Array ("661px","70px");
var image3 = new Array ("225px","70px");
var image4 = new Array ("950px","70px");
var image5 = new Array ("517px","70px");
var image6 = new Array ("372px","70px");
var picLocs = new Array(image1,image2,image3,image4,image5,image6);
//
var correctPitchPosition = new Array("0","0","0","0","0","0");
var allCorrect = true;
var correctPosition = 50;
var counter = 0;
// start drag and drop
function enableDragging(evt) {
if(IE) {
selectedImage = event.srcElement;
} else {
selectedImage = evt.target;
}
tx = parseInt (selectedImage.style.left +0)
ty = parseInt (selectedImage.style.top +0)
if(IE) {
x = event.clientX;
y = event.clientY;
} else {
x = evt.clientX;
y = evt.clientY;
}
document.onmousemove = dragImage;
document.onmouseup = disableDragging;
return false;
}
// Do drag and Drop
function dragImage(evt) {
if (!evt) evt = window.event;
selectedImage.style.left = tx + evt.clientX -x;
selectedImage.style.top = ty + evt.clientY- y;
return false;
}
//Stop Drag and Drop
function disableDragging() {
correctImg();
document.onmousemove = null;
document.onmouseup = null;
correctTeam();
return false;
}
//Set Up Events for every image
function setupEvents() {
for (var j=0; j < document.images.length; j++)
{
document.images[j].onmousedown = enableDragging;
}
}
//Timer Control
function timedCount()
{
document.getElementById('txt').value=c;
c=c+1;
t=setTimeout("timedCount()",1000);
}
//Timer function
function doTimer()
{
if (!timer_is_on)
{
timer_is_on=1;
timedCount();
}
}
//Stop Timer
function stopCount()
{
clearTimeout(t);
timer_is_on=0;
alert("Timer stopped!");
}
function gameStart() {
doTimer();
setupEvents();
c = 0;
for (var i=0; i < 6; i++)
{
randX = Math.random()*800;
myroundX = Math.floor(randX);
document.images[i].style.left = myroundX;
}
alert("You must put the Liverpool player in their correct spaces based on the descriptions, press OK to continue")
}
function correctImg()
{
for (i=0; i < picLocs.length; i++)
{
if ( parseInt(document.images[i].style.left) > parseInt(picLocs [i][0])-correctPosition &&
parseInt(document.images[i].style.left) < parseInt(picLocs[i][0])+correctPosition &&
parseInt(document.images[i].style.top) > parseInt(picLocs[i][1])-correctPosition &&
parseInt(document.images[i].style.top) < parseInt(picLocs[i][1])+correctPosition)
{
correctPitchPosition[i] = 1;
}
}
}
function correctTeam() {
for(var k=0; k < 6; k++) {
if(correctPitchPosition[k] == 1)
counter = counter + 1;
}
if (counter==6)
{
alert("Your time was " + c + " well done!");
stopCount();
}
counter=0;
}
</script>
<link href="_css/styles.css" rel="stylesheet" type="text/css">
</head>
<body>
<img src="_images/agger.jpg" alt="Daniel Agger" class="imgPos" style="position: absolute; top: 320px; left: 804px" />
<img src="_images/carragher.jpg" alt="Jamie Carragher" class="imgPos" style="position: absolute; top: 320px; left: 950px"/>
<img src="_images/gerrard.jpg" alt="Steven Gerrard" class="imgPos" style="position: absolute; top: 320px; left: 372px"/>
<img src="_images/mascherano.jpg" alt="Javier Mascherano" class="imgPos" style="position: absolute; top: 320px; left: 225px"/>
<img src="_images/reina.jpg" alt="Pepe Reina" class="imgPos" style="position: absolute; top: 320px; left: 517px"/>
<img src="_images/torres.jpg" alt="Fernando Torres" class="imgPos" style="position: absolute; top: 320px; left: 661px"/>
<div id="desAgger" class="description" style="left:804px;">
<p>"I have a wicked left foot but i like to stay and defend"</p>
</div>
<div id="desMascherano" class="description" style="left:950px;">
<p>"I'm a tenacious Argentinian who'll chase anything down"</p>
</div>
<div id="desTorres" class="description" style="left:372px;">
<p>"I am from Spain, they call me El Nino"</p>
</div>
<div id="desGerrard" class="description" style="left:225px;">
<p>"I'm the captain of Liverpool FC, and a proud scouser"</p>
</div>
<div id="desReina" class="description" style="left:517px;">
<p>"My real name is Jose and i'm the Liverpool goalkeeper"</p>
</div>
<div id="desCarragher" class="description" style="left:661px;">
<p>"I'm the defensive stalwart, and vice-captain"</p>
</div>
<form>
<input type="button" value="Start game!" onClick="gameStart()" style="position:absolute; left: 500px; top: 539px; width: 20px; height: 20px; width: 120px; height: 40px;">
<input type="button" value="Stop count!" onClick="stopCount()" style="position: absolute; left: 792px; top: 537px; width: 120px; height: 40px;">
<input type="text" disabled id="txt" style="position: absolute; top: 547px; left: 633px" value="0" readonly="readonly">
</form>
</body>
</html>
Thanks very much in advance I have done drag and drop of popup in JavaScript and it is dragged in all directions properly but down.MouseUp event is not triggered properly when I drag the popup towards down.So that it is moving even though I released mouse. I am really screwed up with this bug.Please help..I have to resolve it urgently.... Here is my code.. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
body{
margin:0px;
padding:0px;
}
iframe{
width:800px;
height:500px;
}
img{border:none;}
.parentDisabled
{
width:100%;
height:100%
background-color:red;
position:absolute;
top:0;
left:0;
display:block;
border:1px solid blue;
}
#popup{
position:absolute;
width:800px;
height:500px;
border:2px solid #999188;
display:none;
}
#header{
padding-right:0px;
width:800px;
}
#close{
cursor:hand;
width:15px;
position: absolute;
right:0;
top:0;
padding:2px 2px 0px 0px;
}
#move{
cursor:move;
background:#999188;
width:800px;
line-height:10px;
}
#container{
}
.navigate{
border:1px solid black ;
background:#CC00FF;
color:white;
padding:5px;
cursor:hand;
font-weight:bold;
width:150px;
}
</style>
</HEAD>
<BODY>
<div onClick="showPopUp('w3schools');" class="navigate">W3Schools</div>
<div onClick="showPopUp('yahoo');" class="navigate">Yahoo</div>
<div onClick="showPopUp('linkedin');" class="navigate">LinkedIn</div>
<div onClick="showPopUp('vistex');" class="navigate">Vistex</div>
<div id="popup">
<div id="header">
<span id="move"></span>
<span id="close"><img src="close_red.gif" onClick="closePopUp()" alt="Close"/></span>
</div>
<div id="container">
<iframe name="frame" id="Page_View" frameborder=0>
page cannot be displayed
</iframe>
</div>
</div>
</BODY>
<script>
var popUpEle=null;
function showPopUp(value,evt)
{
evt = evt ? evt : window.event;
var left=evt.clientX;
var top=evt.clientY;
popUpEle = document.getElementById('popup');
if(popUpEle)
{
closePopUp();
var url= "http://www."+value+".com";
document.getElementById('Page_View').src=url;
popUpEle.style.left=left;
popUpEle.style.top=top;
popUpEle.style.filter="revealTrans( transition=1, duration=1)";
popUpEle.filters.revealTrans( transition=1, duration=1).Apply();
popUpEle.filters.revealTrans( transition=1, duration=1).Play();
popUpEle.style.display="inline";
}
}
function closePopUp(){
if(popUpEle)
{
popUpEle.style.filter="revealTrans( transition=0, duration=4)";
popUpEle.filters.revealTrans( transition=0, duration=5).Apply();
popUpEle.filters.revealTrans( transition=0, duration=5).Play();
popUpEle.style.display="none";
}
}
var dragApproved=false;
var DragHandler = {
// private property.
_oElem : null,
// public method. Attach drag handler to an element.
attach : function(oElem) {
oElem.onmousedown = DragHandler._dragBegin;
// callbacks
oElem.dragBegin = new Function();
oElem.drag = new Function();
oElem.dragEnd = new Function();
return oElem;
},
// private method. Begin drag process.
_dragBegin : function(e) {
var oElem = DragHandler._oElem = this;
if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; }
var x = parseInt(oElem.style.left);
var y = parseInt(oElem.style.top);
e = e ? e : window.event;
if (e.pageX || e.pageY)
{
oElem.mouseX = e.pageX;
oElem.mouseY = e.pageY;
}
else if (e.clientX || e.clientY) {
oElem.mouseX = e.clientX + document.body.scrollLeft+ document.documentElement.scrollLeft;
oElem.mouseY = e.clientY + document.body.scrollTop+ document.documentElement.scrollTop;
}
document.onmousemove = DragHandler._drag;
document.onmouseup = DragHandler._dragEnd;
return false;
},
// private method. Drag (move) element.
_drag : function(e) {
var oElem = DragHandler._oElem;
var x = parseInt(oElem.style.left);
var y = parseInt(oElem.style.top);
e = e ? e : window.event;
var clientXTmp,clientYTmp;
if (e.pageX || e.pageY)
{
clientXTmp = e.pageX;
clientXTmp = e.pageY;
}
else if (e.clientX || e.clientY) {
clientXTmp = e.clientX + document.body.scrollLeft+ document.documentElement.scrollLeft;
clientYTmp = e.clientY + document.body.scrollTop+ document.documentElement.scrollTop;
}
var tmpX = x + (clientXTmp - oElem.mouseX);
var tmpY = y + (clientYTmp - oElem.mouseY);
if(tmpX<=0){tmpX = 0;}
if(tmpY<=0){tmpY = 0;}
oElem.style.left = tmpX + 'px';
oElem.style.top = tmpY + 'px';
oElem.mouseX = clientXTmp;
oElem.mouseY = clientYTmp;
return false;
},
// private method. Stop drag process.
_dragEnd : function()
{
var oElem = DragHandler._oElem;
document.onmousemove = null;
document.onmouseup = null;
DragHandler._oElem = null;
}
}
DragHandler.attach(document.getElementById('popup'));</script>
</HTML>
can someone give me the code to display drop down date with default todays date selected...format dd/mm/yyyy i found the code to display month in mon format..what is to be modified to get in mm format here ______________ <script> var monthtext=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec']; function populatedropdown(dayfield, monthfield, yearfield){ var today=new Date() var dayfield=document.getElementById(dayfield) var monthfield=document.getElementById(monthfield) var yearfield=document.getElementById(yearfield) for (var i=0; i<31; i++) dayfield.options[i]=new Option(i, i+1) dayfield.options[today.getDate()]=new Option(today.getDate(), today.getDate(), true, true) //select today's day for (var m=0; m<12; m++) monthfield.options[m]=new Option(monthtext[m], monthtext[m]) monthfield.options[today.getMonth()]=new Option(monthtext[today.getMonth()], monthtext[today.getMonth()], true, true) //select today's month var thisyear=today.getFullYear() for (var y=0; y<20; y++){ yearfield.options[y]=new Option(thisyear, thisyear) thisyear+=1 } yearfield.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true) //select today's year } </script> |
|||||||