|
JavaScript - Javascript Flow Chart - Hiding Certain Data Until Being Clicked
I am really new to coding and am trying to include a flowchart that I have created on my site. There is a series of 5 questions with 2 possible answers for each question. Can anyone help me with some coding that would let me show only the first question and based on how they answer that, the flow chart would open up to the second question and once they answer the second question, it opens up to the third question and so on?
Similar TutorialsHi, I would like to use the following chart in my webpage http://people.iola.dk/olau/flot/examples/visitors.html the data being used in the chart example above looks like this: [1196722800000, 77], [1196809200000, 3636], [1196895600000, 3575], ... I guess that the long number is the date?! The data I have is: a date that is coming from my database which was added using the date(); object and a numerical figure such as 21.365 or 30.432 or 36.856 here is my code below currently in a list format (HTML): Code: <script type="text/javascript" charset="utf-8">
var html5rocks = {};
html5rocks.webdb = {};
html5rocks.webdb.db = null;
html5rocks.webdb.open = function() {
var dbSize = 10 * 1024 * 1024; // 10MB
html5rocks.webdb.db = openDatabase("Todo", "1.0", "Todo manager", dbSize);
}
html5rocks.webdb.createTable = function() {
var db = html5rocks.webdb.db;
db.transaction(function(tx) {
tx.executeSql("ALTER TABLE bmical ADD bmires INTEGER");
tx.executeSql("CREATE TABLE IF NOT EXISTS bmical(ID INTEGER PRIMARY KEY ASC, height1 TEXT, weight1 TEXT, bmires TEXT, added_on DATETIME)", []);
});
}
html5rocks.webdb.addTodo = function(todoText) {
var db = html5rocks.webdb.db;
db.transaction(function(tx){
var weight1 = document.getElementById("weight1").value;
var height2 = todoText / 100
var BMI = weight1 / (height2 * height2)
var BMI = BMI;
var bmires = BMI.toFixed(3);
var addedOn = new Date();
tx.executeSql("INSERT INTO bmical(height1, weight1, bmires, added_on) VALUES (?,?,?,?)",
[todoText, weight1, bmires, addedOn],
html5rocks.webdb.onSuccess,
html5rocks.webdb.onError);
});
}
html5rocks.webdb.onError = function(tx, e) {
alert("There has been an error: " + e.message);
}
html5rocks.webdb.onSuccess = function(tx, r) {
// re-render the data.
html5rocks.webdb.getAllTodoItems(loadTodoItems);
}
html5rocks.webdb.getAllTodoItems = function(renderFunc) {
var db = html5rocks.webdb.db;
db.transaction(function(tx) {
tx.executeSql("SELECT * FROM bmical ORDER BY added_on DESC", [], renderFunc,
html5rocks.webdb.onError);
});
}
html5rocks.webdb.deleteTodo = function(id) {
var db = html5rocks.webdb.db;
db.transaction(function(tx){
tx.executeSql("DELETE FROM bmical WHERE ID=?", [id],
html5rocks.webdb.onSuccess,
html5rocks.webdb.onError);
});
}
function loadTodoItems(tx, rs) {
var rowOutput = "";
var todoItems = document.getElementById("todoItems");
for (var i=0; i < rs.rows.length; i++) {
rowOutput += renderTodo(rs.rows.item(i));
}
todoItems.innerHTML = rowOutput;
}
function renderTodo(row) {
return "<li>On: " + row.added_on + " Height: " + row.height1 + " Weight: " + row.weight1 + " BMI: " + row.bmires + "<a class='delete' href='javascript:void(0);' onclick='html5rocks.webdb.deleteTodo(" + row.ID +");'>Delete</a></li>";
}
function init() {
html5rocks.webdb.open();
html5rocks.webdb.createTable();
html5rocks.webdb.getAllTodoItems(loadTodoItems);
}
function addTodo() {
var height1 = document.getElementById("height1");
html5rocks.webdb.addTodo(height1.value);
height1.value = "";
}
</script>
the 2 variables I'd like to use a bmires, addedOn Hey all i am in need of some help trying to figure out how to pass a string into an array field for a chart. The chart i am using is this [http://www.highcharts.com/] Here is the chart code: Code: function drawChart(theDATA)
{
var chart = new Highcharts.Chart({
chart: {renderTo: 'container',defaultSeriesType: 'column'},
title: {text: 'March 2010 Confirmed User Visit\'s'},
xAxis: {categories: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31']},
yAxis: {min: 0,title: {text: 'User Visit\'s'}},
legend: {layout: 'vertical',backgroundColor: '#FFFFFF',style: {left: '100px',top: '70px',bottom: 'auto'}},
tooltip: {formatter: function() {return this.y;}},
plotOptions: {column: {pointPadding: 0.2,borderWidth: 0}},
series: [{name: 'Confirmed Users Visit\'s',
data: theDATA.split(',')
}]
});
}
With the code above, you would think that theDATA would work but it does not display the data within it. Say that theDATA is '2,5,4,7,8,9'. If i had this: Code: data: [2,5,4,7,8,9] Then it would work just fine. But if i use those same numbers... Code: theData = "2,5,4,7,8,9"
data: theDATA.split(',')
It does nothing on the chart... So what am i doing wrong???? David Hi everyone, I am new to web development. The company I am working for would like to develop a data analysis web interface. This interface would take information from a mySQL database from certain queries and then save the data into an array. After this the data would be exported to Microsoft Excel where a Chart would be created and then uploaded to the web interface. So far I have been able to store the mySQL data into an array but I have been having trouble trying to determine if you can in fact use javascript to tell Excel to create the chart. Any help would be greatly appreciated. So I have a new window document write which outputs all my data after validation into a new window, I have tried to write a button which will (when clicked) send that information to an email address. here is my code so far. i spent about 2 hours checking and playing around looking for errors couldnt find any. I think the problem is the function EmailForm and function subwrite. Is a button written into a new window a common thing to do? or is there another simpler way, however i want the user to be able to check to see if there data is valid and then click to send the email. Code: <HTML>
<!--learn to program through JavaScript-->
<mymerch.HTML>
<HEAD>
<TITLE> mymerch </TITLE>
<SCRIPT LANGUAGE=JavaScript>
//declaringvariables
var firname;
var surname;
var phonenumber;
var emailaddress;
var streetnamenumber;
var yoursuburb;
var postcode;
var yourstate;
var product1;
var product2;
var product3;
var product4;
var product5;
var product6;
var product7;
var product8;
var totalc;
var paymethods;
var method;
var value;
var Cost;
var numericExpression;
var alphaExpression;
var sendemail;
var subject;
var message;
var mailto_link;
var win;
function main() {
//open function main
//function main which validates all data
//declaring variables
firname = document.merch.firstname.value;
surname = document.merch.lastname.value;
phonenumber = document.merch.phonenum.value;
emailaddress = document.merch.emailadd.value;
streetnamenumber = document.merch.stnamenum.value;
yoursuburb = document.merch.suburb.value;
postcode = document.merch.pcode.value;
yourstate = document.merch.state.value;
if (firname == "")
{
alert("Please fill in your Firstname.")
document.merch.firstname.value.focus()
return true;
}
//checks to see if no data as been entered and alerts the user if so.
alphaExpression = /[a-zA-z]/;
if(document.merch.firstname.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the firstname field")
document.merch.firstname.value.focus()
return false;
}
//checks to see if the data entered is letter and if not true returns false.
if (surname == "")
{
alert("Please fill in your Surname.")
document.merch.lastname.value.focus()
return false
}
//checks to see if no data as been entered and alerts the user if so.
alphaExpression = /[a-zA-z]/;
if(document.merch.lastname.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the lastname field")
document.merch.lastname.value.focus()
return false;
}
//checks to see if the data entered is letter and if not true returns false.
numericExpression = /^[0-9+\ ]+$/;
if(document.merch.phonenum.value.match(numericExpression)){
}else{
alert("You can only enter numbers in the Phonenumber field")
document.merch.phonenum.value.focus()
return false;
}
//checks to see if the data entered is a number and if not true returns false.
if(document.merch.phonenum.value.length <7)
{
alert("The Phone Number you have entered is not valid it contains less than 7 digits.")
document.merch.phonenum.focus()
return false
}
//checks to see if the phone number is less than 7 and if so returns false.
if(document.merch.phonenum.value.length >10)
{
alert("The Phone Number you have entered is not valid it contains more than 10 digits.")
document.merch.phonenum.focus()
return false
}
//If phone number is more than 10 return false
if (emailaddress == "")
{
alert("Sorry, your email address is not valid. You didn't enter anything.");
document.merch.emailadd.focus()
return false
}
//checks to see if no data as been entered and alerts the user if so.
if (emailaddress.indexOf("@")==-1)
{
alert("Sorry, your email address is not valid. It doesn't have an @ symbol");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an "@" and alerts the user if false.
if (emailaddress.indexOf(".")==-1)
{
alert("Sorry, your email address is not valid. It doesn't have .COM");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an dot and alerts the user if false.
if (emailaddress.indexOf(" ")!=-1)
{
alert("Sorry, your email address is not valid. It has a space!");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an space and alerts the user if false.
if (streetnamenumber == "")
{
alert("Please fill in your Street Name and Number.")
document.merch.stnamenum.value.focus()
return false
}
//checks to see if the data is empty and alerts the user if true.
if (document.merch.suburb.value == "")
{
alert("Please fill in your Suburb.")
document.merch.suburb.value.focus()
return false
}
//checks to see if the data is empty and alerts the user if true.
alphaExpression = /[a-zA-z]/;
if(document.merch.suburb.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the Suburb field")
document.merch.suburb.value.focus()
return false;
}
//checks to see if the data entered is a letter and if not true returns false.
if(document.merch.pcode.value.length <3)
{
alert("The postcode you have entered is not valid.")
document.merch.pcode.value.focus()
return false
}
//checks to see if the data has less than 3 characters and alerts the user if true.
numericExpression = /^[0-9+\ ]+$/;
if(document.merch.pcode.value.match(numericExpression)){
}else{
alert("You can only enter numbers in the postcode field")
document.merch.pcode.value.focus()
return false;
}
//checks to see if the data entered is a number and if not true returns false.
if(document.merch.pcode.value.indexOf(" ")!=-1)
{
alert("The postcode you have entered is not valid.")
document.merch.pcode.value.focus()
return false
}
//checks to see if the data has a space and alerts the user if true.
if (document.merch.state.value == "Select")
{
alert("Please select your state")
document.merch.state.focus()
return true
}
//checks to see if the data has been selected and alerts the user if false.
paymentmeth();
openNewWin();
subWrite();
//calling the two functions
}
function paymentmeth()
{
for (i = 0; i < document.merch.payway.length; i++){
if (document.merch.payway[i].checked == true){
//a loop that is used to determine the paymethod and checks to see if data has been entered
method = document.merch.payway[i].value
//declares method
}//ends IF
}//ends
//error control for nothing checked
if (method == false)
{
//if method equals nothing show alert
// this fails to validate
alert("You forgot to select Pay Method.")
}
//document.merch.paytype.value = method;
}
function emailForm(){
sendemail = "micha3l26@hotmail.com";
subject = "Order Details";
message = ("Clients Information firstname is "+firname +" Surname is "+ surname +" PhoneNumber is "+ phonenumber +" EmailAddress is "+ emailaddress +" Street Name and Number is "+ streetnamenumber +" Suburb is "+ yoursuburb +" Postcode is "+ postcode +" State is "+ yourstate +" Payment Method is "+ method +" Total Payment is "+ Cost);
mailto_link = ('mailto:'+sendemail+'?subject='+subject+'&body='+message);
win = window.open(mailto_link,"emailWindow");
if (win && win.open &&!win.closed)win.close();
}
//ends function
function openNewWin() {
var newWin;
newWin = window.open("","newWin","status,height=600,width=600")
//opens the window and sets it 600px by 600px
}
//open new window
function subWrite() {
if (newWin.closed) {
makeNewWin()
}
newWin.focus()
var image = "<img src=quote.jpg>";
//declares variable image as the banner jpg
newWin.document.write(image)
//document writes the variable image
newWin.document.write("<br/>");
newWin.document.write("<br/>");
newWin.document.write("Your FirstName is "+firname);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Surname is "+surname);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your PhoneNumber is "+phonenumber);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your EmailAddress is "+emailaddress);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Street Name and Number is "+streetnamenumber);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Suburb is "+yoursuburb);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Postcode is "+postcode);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your State is "+yourstate);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Pay Method is "+method);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your total payment is "+Cost);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("<input type="button" onClick="emailForm()" value="Send Email"/> ");
//("<div style="border:2px solid black;padding:10px;">
//Please <a href="#" onclick="emailForm();">Email Support</a>
//</div>");
//a document write to input a button, with an onclick function to mailto a email address
var newContent = "</BODY></HTML>"
newWin.document.write(newContent)
newWin.document.close() // close layout stream
}
//calling the two functions
//the send email button does not work.
function tally()
{
//the function that calculates the prices of tshirts
Cost =0;
//sets the cost at 0
if (document.merch.tshirt1.checked)
{
Cost = Cost + parseInt(document.merch.tshirt1.value);
}
//cost which is 0 + the tshirt value equals the price of tshirt 1
//repeated 8 times
if (document.merch.tshirt2.checked)
{
Cost = Cost + parseInt(document.merch.tshirt2.value);
}
if (document.merch.tshirt3.checked)
{
Cost = Cost + parseInt(document.merch.tshirt3.value);
}
if (document.merch.tshirt4.checked)
{
Cost = Cost + parseInt(document.merch.tshirt4.value);
}
if (document.merch.tshirt5.checked)
{
Cost = Cost + parseInt(document.merch.tshirt5.value);
}
if (document.merch.tshirt6.checked)
{
Cost = Cost + parseInt(document.merch.tshirt6.value);
}
if (document.merch.tshirt7.checked)
{
Cost = Cost + parseInt(document.merch.tshirt7.value);
}
if (document.merch.tshirt8.checked)
{
Cost = Cost + parseInt(document.merch.tshirt8.value);
}
document.merch.Total.value = "$"+Cost;
}
</script>
Code: <style type="text/css">
<!--
.style1 {
font-family: Century Gothic;
color: #FFFFFF;
}
.style3 {font-family: Century Gothic; color: #FFFFFF; font-size: 24px; }
.style5 {color: #000000}
-->
<!--Declaring the different styles of text !-->
</style></HEAD>
<BODY BGCOLOR="BLACK">
<div align="center"><img src="mymerchbanner.jpg" width="787" height="158">
<!The placement of the main banner>
</div>
<HR>
<FORM NAME="merch" onSubmit="main()">
<!declaring the forms name and onsubmit run the function main>
<table width="368" border="1" bordercolor="#000000" bgcolor="#000000">
<tr>
<td width="187" height="40"><span class="style3">First Name: </span></td>
<td width="165"><input type="text" name="firstname" id="firstname"></td>
</tr>
<!firstname textboxes>
<tr>
<td height="45"><span class="style3">Last Name: </span></td>
<td><input type="text" name="lastname" id="lastname"></td>
</tr>
<!lastname textboxes>
<tr>
<td height="44"><span class="style3">Phone Number:</span></td>
<td><input type="text" name="phonenum" id="phonenum"></td>
</tr>
<!phonenumber textboxes>
<tr>
<td height="43"><span class="style3">Email Address:</span></td>
<td><input type="text" name="emailadd" id="emailadd"></td>
</tr>
<!emailaddress textboxes>
<tr>
<td><span class="style3">Street Name and Number:</span></td>
<td><input type="text" name="stnamenum" id="stnamenum"></td>
</tr>
<!streetnameandnumber textboxes>
<tr>
<td height="43"><span class="style3">Suburb:</span></td>
<td><input type="text" name="suburb" id="suburb"></td>
</tr>
<!suburb textboxes>
<tr>
<td height="42"><span class="style3">Postcode:</span></td>
<td><input type="text" name="pcode" id="pcode"></td>
</tr>
<!postcode textboxes>
<tr>
<td height="42"><span class="style3">State:</span></td>
<td> <select name="state" id="state">
<option value="SA">SA</option>
<option value="TAS">TAS</option>
<option value="QLD">QLD</option>
<option value="VIC">VIC</option>
<option value="NSW">NSW</option>
<option value="ACT">ACT</option>
<option value="NT">NT</option>
<option value="WA">WA</option>
<option value="Select" selected>Click to select</option>
</select> </td>
</tr>
<!state selection>
</table>
<p> </p>
<p class="style3">What Would you Like Today? </p>
<table width="684" border="0" bordercolor="#000000" bgcolor="#000000">
<tr>
<td width="79" class="style1">0001</td>
<td width="79">2<span class="style1">0002</span></td>
<td width="79"><span class="style1">0003</span></td>
<td width="79"><span class="style1">0004</span></td>
<td width="79"><span class="style1">0005</span></td>
<td width="79"><span class="style1">0006</span></td>
<td width="79"><span class="style1">0007</span></td>
<td width="79"><span class="style1">0008</span></td>
</tr>
<tr>
<td><img src="1.png" width="100" height="100"></td>
<td><img src="2.png" width="100" height="100"></td>
<td><img src="3.png" width="100" height="100"></td>
<td><img src="4.png" width="100" height="100"></td>
<td><img src="6.png" width="100" height="100"></td>
<td><img src="8.png" width="100" height="100"></td>
<td><img src="9.png" width="100" height="100"></td>
<td><img src="10.png" width="100" height="100"></td>
</tr>
<!tshirt images for the 8 shirts>
<tr>
<td><input type="checkbox" name="tshirt1" Value="15" onClick="tally()"> ></td>
<td><input type="checkbox" name="tshirt2" Value="15" onClick="tally()"> ></td>
<td><input type="checkbox" name="tshirt3" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt4" Value="30" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt5" Value="30" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt6" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt7" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt8" Value="15" onClick="tally()"> > </td>
</tr>
<!8 checkboxes with diffent values that are used to add up the prices and onclick run function tally>
<tr>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$30</td>
<td class="style1">$30</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
</tr>
<!text for prices>
</table>
<td> Total <INPUT TYPE="text" NAME="Total" value="0" size="7"></td>
<p class="style3">How Will you Like to Pay? </p>
<table width="268" border="0" align="center" bordercolor="#000000">
<tr>
<td width="196" class="style3">Cash on Delivery </td>
<td width="56"><input name="payway" type="radio" value="Cash"onClick="paymentmeth()"></td>
</tr>
<!radio button with different values and onclick run paymentmeth>
<tr>
<td class="style3">Bank Deposit </td>
<td><input name="payway" type="radio" value="Bank Deposit"onClick="paymentmeth()"></td>
</tr>
<tr>
<td class="style3">Paypal</td>
<td><p>
<input name="payway" type="radio" value="Paypal"onClick="paymentmeth()">
<label></label>
</p></td>
</tr>
</table>
<p> </p>
<p align="center" class="style3">
<INPUT TYPE="SUBMIT" VALUE="Show Invoice" onSubmit="main()">
<!submit button that runs function>
<span class="style5"> </span>
<input type="RESET" />
<!reset button that runs function>
<span class="style5"> </span>
</p>
</FORM>
</BODY>
</HTML>
Sorry I am new to JavaScript. Says that a.html has two same anchor links (<a href="b.html">b</a>). The anchor links are uneditable but we could add JavaScript to the a.html. Except for dynamic adding onclick event, any other ways could get to know which anchor link being clicked? I want to hide my JavaScript but when I checked the FAQ of this forum, I saw that it said that it isn't possible. But how did worldometers.info did it? Because I cant find the JavaScript source. I have a store that sells certain products. When you add a product to the cart and go to view your cart you can estimate shipping costs. It will list different shipping methods and the cost to ship them. However, there is one shipping method called "Request a Quote" that has a price value of 0.01. This can confuse customers because they sometimes think that the shipping is only $0.01 when it really isn't. So I want to just remove this value, but still list pricing for all the other shipping methods. I know I can just do this using CSS and setting the display to none. But am having trouble getting it to work. Here is the link to the shopping cart page: Folding Chairs and Tables.com - Shopping Cart If you add a product and run the 'estimate shipping and tax' you will see what I'm talking about. How can I remove this value? Any help would be really appreciated. Here is a picture of what the table looks like when you calculate the estimate shipping costs: Thank You I am in the progress of building a new website; the layout and stuff is already done for the most part, but I am having a problem with the two order forms on my website. Well not the forms themselves, more with how they appear (and disappear). Like stated I have 2 forms on my website. When coming to my website they should be hidden (standard). When someone wants to order they press the link for order form A or form B. From here I am running into several problems. Problem #1 I want each form only to appear when they click on a link. For example; when a person clicks on link 1 form A appears. If they click on link 2 form B appears. Problem #2 If form A appears and they click on link 2, than form A should disappear and form B should be visible and the other way around. Problem #3 Is it possible to load a page within the DIV for example I want form B to include extra-info.php. Is this possible? If I understand correctly the above would be possible with Javascript and with the use of hidden DIV's. But I really don't know much about Javascript to pull this of myself. Anyone in here who can help me out and provide me with a working example? I would be very grateful... If something is not clear, please do no hesitate to ask me... I am trying to make an order form I am working on accessible for users who have javascript turned off in their browser, and to do this I would like to hide a div if JS is disabled. Searching the Web has led me to think that styling the div to not display is the way forward and then using JS to display it. It is the JS bit I am struggling with! The div in question is a set of radio buttons to allow a purchaser to choose how many gift memberships they want to buy: Code: <div id="giftmember-buttons" style="display:none";> <h2 class="threepeaksform">How many gift memberships do you wish to purchase?</h2> <fieldset class="threepeaksform"> <legend>Please select the number of people you are buying a gift membership for using the buttons below.</legend> <div class="generalcontactform-group"> <label>1</label><input name="numbergift" type="radio" value="1" checked="checked" onClick="showhidefields(this.value)" /> <label>2</label><input name="numbergift" type="radio" value="2" onClick="showhidefields(this.value);"/> <label>3</label><input name="numbergift" type="radio" value="3" onClick="showhidefields(this.value);"/> <label>4</label><input name="numbergift" type="radio" value="4" onClick="showhidefields(this.value);"/> </fieldset> </div> <br /> </div> I have used a JS switch function lower down the page but that relies on onClick to make it work, I want the above div to display as the page loads - would I do this with the switch function and onLoad applied to the body to make the div display when JS is on? The full page is at: http://yd97.peak1.titaninternet.co.u...sform-gift.htm Thanks for any help. Cheers Stu Hello, I'm new to the forum. I tried coding this myself, but i'm just not that well versed in javascript and need a little help. I am trying to show certain div tags when you click on a hyperlink in an html document. I have four links (bio, news, portfolio, and resume) and four div tags (bio, news, portfolio, and resume). I am just going to show the code for one of the links. This is what I have for the bio link in the head of the html: Code:
function setVisible( setting )
{
var myElement = document.getElementById("bio");
if(setting)
myElement.style.visibility="visible";
else
myElement.style.visibility="hidden";
}
</script>
This is what I have in the style sheet: Code:
#bio {
position: absolute;
font: 9pt arial;
line-height: 10.5pt;
color: #fff;
width: 575px;
height: 300px;
margin-top: 390px;
margin-right: auto;
margin-left: 40px;
margin-bottom: 5px;
z-index: 1;
border: 0px solid #fff;
}
This is what I have on the link in the html doc (I'm assuming this is wrong, I don't know what the proper code should be): Code: <a href="javascript:onClick="setVisible(true)";">BIO</a> Does what I'm trying to do make sense? I'm assuming that it would be the same set up for all four links? Please let me know if I need to be more specific. Any help would GREATLY be appreciated! Thank you, Gerry Consider the following piece of code: PHP Code: <form method='post' name='myform'> <input type='submit' name='sub' value='submit 1' /> <input type='submit' name='sub' value='submit 2' /> <a href='javascript:document.myform.submit();'>submit 3</a> </form> <?php echo "You clicked ".$_POST["sub"]; ?> So if you click "submit 1", the output will be You clicked submit 1. And if you click "submit 2", the output will be You clicked submit 2. That's obvious. But ... what do I need to do to pass the key/value pair "sub" = "submit 3" to the server via POST when I click on the hyperlink showing "submit 3" - so that the output is You clicked submit 3 (i.e. so that $_POST contains "submit 3" referenced to index "sub"). I've tried <a href='javascript: a = {"x" : 1}; document.myform.submit(a);'>submit 3</a>, but that doesn't cause a to be passed via POST. Hi, Sorry for the (HELP!) addition in the title, but i'm just stumped here. I am trying to show and hide div layers when I click on a button in a flash movie. The flash movie is in it's own div and the content below is also in it's own div. Is there a way to call the function from flash so that content in another div is affected? The code to show and hid layers in html is working and is he Code: //visible layers
function $_(IDS) { return document.getElementById(IDS); }
function setVisible( IDS ) {
var obj;
var sel = $_('divContent').getElementsByTagName('div');
for (var i=0; i<sel.length; i++) {
obj = sel[i].id;
if (obj != IDS) { $_(obj).style.display = 'none'; }
else { $_(obj).style.display != 'block' ? $_(obj).style.display="block" : $_(obj).style.display="none"; }
}
}
window.onload = function() {
setVisible('BIO');
};
</script>
</head>
<body>
<div id="navigation">
<a href="#" onClick="setVisible('BIO'); return false;">Who I Am</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('News'); return false;">What's New</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('Portfolio'); return false;">Portfolio</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('Resume'); return false;">Resume</a>
</div>
<div id="divContent">
<div id="BIO" class='divElem'>
<p>This is my content for bio</p>
</div>
<div id="News" class='divElem'>
<pThis is my content for news</p>
</div>
<div id="Portfolio" class='divElem'>
<p><This is my content for portfolio </p>
</div>
<div id="Resume" class='divElem'>
<p>This is my content for resume</p>
</div>
</div>
</body>
Is there a way to call the function in flash on a button? Any help you can give would be GREATLY appreciated. Thanks and forever indebted. Gerry Hello all! I'm having a bit of an issue here with my lastest project. What I'm trying to do is have a menu that a user would click one of two links which would change the targeted iFrame, then repeat for two more options, and again for two more. It is essentially a filtering system for videos (the best way for you to see what I mean is to check out http://grph.cmwdesign.ca). My actual issue here is the changing of the iframe href, and on top of that, I seem to not to be able to properly get my functions to run all the time. Here is my Javascript: Code:
var categoryLink=new Array();
var counter;
var link = "";
categoryLink[0] = "";
categoryLink[1] = "";
categoryLink[2] = "";
counter = "0";
$(document).ready(function() {
$(".atonal").live('click', function() { {
alert("sometext");
if (categoryLink[0]=="") {
categoryLink[0] = "atonal";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[0] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
$(document).ready(function() {
$(".tonal").live('click', function() {
alert("sometext");
if (categoryLink[0]=="") {
categoryLink[0] = "tonal";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[0] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
$(document).ready(function() {
$(".being").live('click', function() {
alert("sometext");
categoryLink[1] = "being"; $("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
if (categoryLink[1]=="") {
categoryLink[1] = "being";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[1] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
$(document).ready(function() {
$(".doing").live('click', function() {
alert("sometext");
if (categoryLink[1]=="") {
categoryLink[1] = "doing";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[1] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
$(document).ready(function() {
$(".abstract").live('click', function() {
alert("sometext");
if (categoryLink[2]=="") {
categoryLink[2] = "abstract";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[2] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
$(document).ready(function() {
$(".documentary").live('click', function() {
alert("sometext");
if (categoryLink[2]=="") {
categoryLink[2] = "documentary";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
else {
categoryLink[2] = "";
$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
}
});
});
and the HTML in question: Code: <table> <tr> <td height="35" width="210" valign="top">choose your sound</td> <td width="165" valign="top"><a href="#" id="atonal">atonal sounds</a></td> <td width="165" valign="top"><a href="#" id="tonal">tonal sounds</a></td> </tr> <tr> <td height="35" width="210" valign="top">choose your text</td> <td width="165" valign="top"><a href="#" id="being">being words</a></td> <td width="165" valign="top"><a href="#" id="doing">doing words</td> </tr> <tr> <td height="35" width="210" valign="top">choose your image</td> <td width="165" valign="top"><a href="#" id="abstract">abstract images</a></td> <td width="165" valign="top"><a href="#" id="documentary">documentary images</a></td> </tr> </table> I'm no Javascript wiz, so I'm sure I'm probably not going about this entirely the correct way. Any suggestions would be great! <script language="JavaScript"> function changeColor(cell_id){var state1="#dde6ed"; var state2="#ffc20e"; var cellid = new Array ("id1", "id2", "id3", "id4", "id5", "id6"); for(var i = 0; i < cellid.length; i++){var nav = document.getElementById(cellid[i]); if(cellid == nav.id){nav.style.backgroundColor=state2;} else {nav.style.backgroundColor=state1;}}} </script> Can anyone tell me what is wrong with this script. I put an onClick= changeColor(this);" in my <td> tag to call the script but still not working. edit::I guess I tried everything else before thinking of a toggle variable....seems to be working now I have an if clause that triggers died(); Quote: died() { monster.y=-100; //move element off canvas setTimeout("respawn()", 2500); } respawn() { //move monster to random location inside canvas monster.x = 32 + (Math.random() * (canvas.width - 64)); monster.y = 32 + (Math.random() * (canvas.height - 64)); } if(collision condition true) { died(); } This works but it sends setTimeout("respawn()",2500); about a dozen times, so 2.5 seconds later when it respawns it runs a dozen times and the monster flickers around the canvas before finding it's final destination. I've tried both a WHILE loop which WORKED initially but I couldn't get it to reset properly, it worked the first time it ran and that was it.... I tried an if() with a global variable called count so it would only be called if count was under 2 but it didn't work right.... I tried a for loop as well. But my main() function is running every 10ms, and it just triggers things so fast that it triggers things multiple times when I only want it to fire once.... pseudo of what I'm trying to do. If(collision) {died();} died(){ move char off viewable screen, delay 2.5 seconds before moving back onto screen at random location} Seems so simple......but when there's a collision, it sends died() every pixel as the 2 objects move across each other.....where I need it to only trigger died after the first collision is detected and stop checking for 2.5 seconds or the duration of the wait before showing back up on the screen.. so maybe I need a new function to call died which can only be called once.... I've looked all over google but can't seem to find this out. How do you make it so you have 2 text boxes beside each other where you type (for example) 1 character in the first, and it flows into the next (without the need for pressing tab or whatever) I'm talking about the sort of thing you get when entering a software key Hey. I am looking for a gallery/image slider script that looking like this image/or does the same as the image below: Something like that or similar if anyone knows a link to one or knows the code please help. Thanks for reading. Mark. Hi, I was wondering if someone could help me out by providing me with the code which allows the chart to slide on (click on Report a Link , right next to the search box): http://www.watchseries-online.com/20...x9-improv.html I need to imporove the way this functions on my site. Here is how the report a link functions on my site: 1. go to http://tehcake.com/video/Simpsons/6x9 Look right below the video and right above the chatbox " Report Broken Episode/ Problem " if you click on the link, it takes you to another pages where the form is located. I would like to change it so that when a user clicks on " Report Broken Episode/ Problem ", then it simply relveals a sliding down chart that operates like the one found at http://www.watchseries-online.com/20...x9-improv.html (where it says : [!] REPORT A LINK in red text, to the left of the searchbox click on that, then click submit. It is not only better looking but also submits without even leaving the page) Can anyone help me get a start to make a tournament chart that assighs a value to each player and depending on that value it beats a other player.
is there a ways in javascript to create graphs chart? i can't seem to find a code on the internet
|
|||||||