|
JavaScript - Need To Duplicate Nav Area
Hi,
on my page below: http://www.jbiddulph.com/helix/events.html I have a navigation of 1,2,3,4,5which when a user clicks on a different number the image changes, I need to have this navigation for the 4 other large boxes underneath?! I can't work out how to go about this?! please help here is the code to the page Code: <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Helix</title>
<link type="text/css" rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/style.css" title="default" /><!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
<script type="text/javascript">
$(function() {
$('#slideshow').after('<div id="nav" class="nav">').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
pager: '#nav',
befo onBefore
});
function onBefore() {
$('#title').html(this.alt);
}
});
</script>
</head>
<body>
<div id="top">
<div id="topwrapper">
<div id="logo">
</div>
<ul id="rightnav">
<li><a href="index.html" title="Home">Home</a></li>
<li><a href="news.html" title="News">News</a></li>
<li><a href="archives.html" title="Archives">Archives</a></li>
<li><a href="finishes.html" title="Finishes">Finishes</a></li>
<li><a href="contact.html" title="Contact">Contact</a></li>
</ul>
<nav>
<ul>
<li><a href="events.html" title="HELIX EVENTS" class="menuselected">HELIX EVENTS</a></li>
<li><a href="marketing.html" title="HELIX MARKETING">HELIX MARKETING</a></li>
<li><a href="film.html" title="HELIX FILM & TV">HELIX FILM & TV</a></li>
<li><a href="exhibitions.html" title="HELIX EXHIBITIONS">HELIX EXHIBITIONS</a></li>
<li><a href="interiors.html" title="HELIX COMMERCIAL INTERIORS">HELIX COMMERCIAL INTERIORS</a></li>
</ul>
</nav>
<div class="line"> </div>
</div>
</div>
<div id="content">
<section id="slider" style="background-color: rgb(160, 191, 74);">
<div id="viewport">
<div id="container">
<div id="section-1" class="section">
<img src="images/slider_01.png">
</div>
</div>
</div>
</section>
<div class="line"> </div>
<h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<div class="dashedlinetop"> </div>
<div id="box">
<div id="slideshow" class="pics">
<img src="images/box1.jpg" alt="1"/>
<img src="images/box2.jpg" alt="2"/>
<img src="images/box3.jpg" alt="3"/>
<img src="images/box4.jpg" alt="4"/>
<img src="images/box5.jpg" alt="5"/>
</div>
</div>
<div class="dashedlinebottom"> </div>
<div class="dashedlinetop"> </div>
<div id="box">
<div id="slideshow" class="pics">
<img src="images/box1.jpg" alt="1"/>
<img src="images/box2.jpg" alt="2"/>
<img src="images/box3.jpg" alt="3"/>
<img src="images/box4.jpg" alt="4"/>
<img src="images/box5.jpg" alt="5"/>
</div>
</div>
<div class="dashedlinebottom"> </div>
<div class="dashedlinetop"> </div>
<div id="box">
<div id="slideshow" class="pics">
<img src="images/box1.jpg" alt="1"/>
<img src="images/box2.jpg" alt="2"/>
<img src="images/box3.jpg" alt="3"/>
<img src="images/box4.jpg" alt="4"/>
<img src="images/box5.jpg" alt="5"/>
</div>
</div>
<div class="dashedlinebottom"> </div>
<div class="dashedlinetop"> </div>
<div id="box">
<div id="slideshow" class="pics">
<img src="images/box1.jpg" alt="1"/>
<img src="images/box2.jpg" alt="2"/>
<img src="images/box3.jpg" alt="3"/>
<img src="images/box4.jpg" alt="4"/>
<img src="images/box5.jpg" alt="5"/>
</div>
</div>
<div class="dashedlinebottom"> </div>
<div class="dashedlinetop"> </div>
<div id="box">
<div id="slideshow" class="pics">
<img src="images/box1.jpg" alt="1"/>
<img src="images/box2.jpg" alt="2"/>
<img src="images/box3.jpg" alt="3"/>
<img src="images/box4.jpg" alt="4"/>
<img src="images/box5.jpg" alt="5"/>
</div>
</div>
<div class="dashedlinebottom"> </div>
</div> <!-- end content -->
</body>
</html>
Similar TutorialsHello Guys and Gals, I have got my head around using the jquery validate and submit without refresh and implemented it successfully on a front end form. Now I would like to streemline backend updating by enabling submit without refresh for multiple items on a page, validation would be nice but less important. what I would like to do is something like adding 'here' to the function and 'this' to the form but im not sure how exactly. here is the code im using Code: <title>Untitled Document</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('#form').validate({
rules:{
// your validation rules
},
messages:{
// and validate msgs
},
submitHandler: function(form){
$(form).ajaxSubmit({
target: '#preview',
success: function() { // take these lines out if you dont want to hide the form after submit
$('#formbox').slideUp('slow'); /////////////////
} /////////////////////////////////////////////
});
}
})
});
</script>
</head>
<div id="preview">
</div>
<div id="formbox">
<form id="0" name="0" method="post" action="timbersend.php" >
<label>name</label>
<input type="text" name="name" />
<label>value</label>
<input type="text" name="value" />
<input type="submit" value="submit" name="submit" />
</form>
</div>
<body>
</body>
thanks steve I would like to count how many duplicate values I have in an array. My below attempt doesnt count the duplicate values: Code: var ct = 0;
for(var i = 0;i < myArray.length;i++)
{
var myData = getData[i].city;
if(myData == myData)
{
ct++;
}
alert("Total Count = " + ct);
}
Please advise the best way to do this. disregard...i got it
Is there a method or a way to duplicate the text typed in one textarea to another, with onkeyup or onchange? The problem I'm facing is with FCKeditor. Two textareas with loaded templates and the text has to be manually copied and pasted when changed. Code: <form action="" method="post" name="form1" id="form1"> Subject:<br /> <input type="text" name="subject" value="Subject" size="32" /> <br /> Main Article:<br /> <textarea name="content" cols="50" rows="10"> <?php echo $row['article']; ?> </textarea> <br /> Text version:<br /> <textarea name="content_text" cols="50" rows="10"> <?php echo $row['article']; ?> </textarea> <input type="submit" value="Send" /> </form> I may be going about this all wrong? Send newsletters, it all works - not sure? do I need the second texarea. OMG, Check out the background on this site... http://paulirish.com/ how would I even start to rip that for use on my own site? I'll pay someone $15 on paypal if they can make a css and js file that I can just link too and have this background
Hello Guys, im writing a big page with several different elements in it, and im stuck trying to duplicate a script. first one works "tab b" click each 'icon' and a .png file appears above it to show its selected. "tab c" same script and code seems to only work for first icon, and switch off when clicked on the others. been staring at this for sooooome time now, please can someone see what i have done wrong, as i dont really understand the code im using, im just a beginner. url is http://www.zakscustomcues.com/module...builder2.0.php much appreciated. steve Greetings and salutations. My text and what I have been researching on the internet has not been very helpful in determining the code that I need to prevent a user from entering his/her information more than once. Here is my current code Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD.HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/htm14/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Kudler Fine Foods Contact Page</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">
<!---Kami Demnyan
21 December 2009-->
<script type="text/javascript">
/*<![CDATA[*/
<!--This code ensures that the zip code and telephone numbers are actual numerical digits, not letters-->
function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
window.alert ("Please enter a numerical value");
return false;
}
}
<!--This code ensures that all of the fields contain text and I have it functioning now-->
function submitForm() {
if (document.forms[0].name.value == ""
|| document.forms[0].address.value == ""
|| document.forms[0].city.value == ""
|| document.forms[0].state.value == ""
|| document.forms[0].zip.value == ""
|| document.forms[0].phone.value == ""
|| document.forms[0].email.value == "") {
window.alert("Please enter your missing information");
return false;
}
else
return true;
}
function getCookie(NameOfCookie) {
if (document.cookie.length > 0) {
begin = document.cookie.indexOf(NameOfCookie+"=");
if (begin != -1) {
begin += NameOfCookie.length+1;
end = document.cookie.indexOf(";", begin);
if (end == -1) end = document.cookie.length;
return unescape(document.cookie.substring(begin, end)); }
}
return null;
}
function setCookie(NameOfCookie, value, expiredays) {
var ExpireDate = new Date ();
ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 * 3600 * 1000));
document.cookie = NameOfCookie + "=" + escape(value) +
((expiredays == null) ? "" : "; expires=" + ExpireDate.toGMTString());
}
function delCookie (NameOfCookie){
if (getCookie(NameOfCookie)) {
document.cookie = NameOfCookie + "=" +"; expires=Tues, 02-Feb-10 00:00:01 GMT";
}
}
/*]]>*/
</script>
</head>
<body>
<h1> KUDLER FINE FOODS </h1>
<h2> JOIN OUR MAILING LIST</h2>
<!--This is where the user will input all of their information to join the mailing list-->
<form action="completeform.html" method="get" onsubmit="return submitForm();"
enctype="application/x-www-form-urlencoded">
<p>Name<br />
<input type="text" name="name" size="50" /></p>
<p>Address<br />
<input type="text" name="address" size="50" /></p>
<p>City, State, Zip <br />
<input type="text" name="city" size="30" />
<input type="text" name="state" size="3" />
<input type="text" name="zip" size="10"; onchange="return checkForNumber(this.value)"; /></p>
<p>Telephone<br />
<input type="text" name="phone" size="25" onchange="return checkForNumber(this.value)"; /></p>
<p>Email Address<br />
<input type="text" name="email" size="50" /></p>
<!--This is where the submit and reset buttons are located-->
<p><input type="submit" value="Submit Form" />
<p><input type="reset" value="Reset Form" />
</form>
</body>
</html>
I have created a new web page to link the duplicate cookie too, titled doubleinfo.html. This is what I am using to let the user know that their information has already been entered. My text is telling me that I need to look for a nextform() function, but I didn't have to write one so what would I need to do, if anything, to start the document.cookie = "name" codes? Any help would be greatly appreciated, thanks in advance. Hi there It's huge problem for me but I don't think it is for many of you here. I have been asked at the college to make a manual lottery checker using javascript, but I found lots of problem during the coding. To make it more clear it's about 3 players they always play the same set of 6 number between 1 and 49. the players enter manually the winning number using a prompt which popup when you open the page (No button required for this, just simple prompt). each time you type duplicate number an alert tells that this number been entered, when the six number been successfully entered will ask for the bonus ball the same way but it should between 1 and 49 as well. When this done the program print out for each player the much numbers. This my peace of coding but I stucked in many bits in it. I need your knowledge guys in javascript to fix this for me. Code: <html>
<head>
<title>Lottery Checker</title>
<h1>Lottery Checker</h1>
</head>
<body>
<script type="text/javascript">
//Declare Variable
var number1 = [3, 9, 18, 27, 30, 33];
var number2 = [5, 7, 11, 12, 34, 42];
var number3= [4, 15, 21, 23, 27, 31];
var drawNumber = [];
var bonusBall = [];
//Declare variable Times and Dates
var currentTime = new Date();
var day = currentTime.toUTCString();
// Print out the player set numbers
document.write("<h4>You visited the lottery website at :</h4>" + day); //Print out Times and Dates
document.write('<p>Player number 1 : '+ number1 +'</p>');
document.write('<p>Player number 2 : '+ number2 +'</p>');
document.write('<p>Player number 3 : '+ number3 +'</p>');
//Copare Lottery Number arrays
//Add input number using prompt to add the 6 bonus number and the bonus ball
for (var i=0 ; i<=5 ; i++)
{
drawNumber[i] = prompt("Enter the Lottery draw Number.");
drawNumber.sort(function(a, b){return a-b});
//Fix the lottery Numbers between 1 and 49
while (drawNumber[i]<1 || drawNumber[i]>49)
{
drawNumber[i] = prompt("The lottery Number should be between 1 and 49"); // to insert Prompt insteat the Alert
}
if (drawNumber[i] = drawNumber) // if statement to be checked again
{
alert('You already entered this number');// if statement to be checked again
}
}
document.write('<p>The winning lottery number for this week: '+drawNumber+ ', The bonus number: '+ drawNumber[6] + '</p></br>');
//Sort the winning number by each player
// Display the result for each player how many number much
document.write('Player 1 winning numbers: ' + drawNumber +'</br>');
document.write('Player 2 winning numbers: ' + drawNumber +'</br>');
document.write('Player 3 winning numbers: ' + drawNumber +'</br>');
</script>
</body>
</html>
Hi Experts, I have an online application form that a member submits to register with our organization. However I want to make sure that the member submits only one application form per session year. Is there anyway I could setup a java script that lets the member know that they have already submitted their application when they try to re-submit. The current setup lets them submit many applications which I am trying to prevent. Any help is greatly appreciated. Thanks Vinny Hi, I would like to prevent the addition of duplicate items in the following situation. Firstly, I have a listbox with a few options such as Code: <select id="listbox" name="listbox" multiple="multiple" style="width: 580px;">
<option>Java</option>
<option>PHP</option>
<option>Perl</option>
<option>Javascript</option>
<option>C#</option>
<option>Powershell</option>
</select>
Next, I have a submit button with a textbox. The user will be able to submit new options into the listbox via the textbox and submit button. Therefore, I need to prevent the user from entering duplicate items into the listbox. How should I do? The following code is used to add items into the listbox. Code: function addItem()
{
var lst = document.getElementById('listbox'); // listbox control id
var newItem = prompt("Enter New Item","Enter Value Here");
//Option object is created for every option in a selection
//new Option([text[, value[, defaultSelected[, selected]]]]) // Syntax
if(newItem == null)
{
return false;
}
else
{
lst.options[lst.length] = new Option(newItem,newItem,false,false);
return false;
}
}
i've written a js function to find the difference between two dates. the format being used is dd/mm/yyyy hh:mm. The function returns correct value when give one set of values, but go wrong with another set. examples are given below. set 1 : Time 1 = 24/02/2011 09:30 , time 2 = 24/02/2011 16:00 Output is corret here. It gives 6 Hours & 30 Minutes (after converting the difference) set 2: Time 1 = 24/02/2011 09:30 , time 2 = 25/02/2011 16:00 Here, it gives 31 days, 6 Hours & 30 Minutes. My code is given below. Also the alert of dates display strange values. Don't know if it is timezone issue. I wonder what is going wrong here Code: function compareDateTime(frmtime,totime)
{
var date1 = new Date(frmtime);
var date2 = new Date(totime);
var diff = new Date();
alert(date1);
alert(date2);
diff = (date2.getTime()-date1.getTime());
if (diff<0)
{
alert("From Time cannot be later than To Time!");
return 0;
}
else if (diff==0)
{
alert("From Time cannot be equal with To Time!");
return 0;
}
else
{
return diff;
}
}
The returned diff value is broken down as following: Code: if (diff>0)
{
days = Math.floor(diff / (1000 * 60 * 60 * 24));
diff -= days * (1000 * 60 * 60 * 24);
hours = Math.floor(diff / (1000 * 60 * 60));
diff -= hours * (1000 * 60 * 60);
mins = Math.floor(diff / (1000 * 60));
alert(days+","+hours+","+mins);
return true;
}
Please Help... Hi everyone, now I need to add items into a dropdown list, and the items would be sorted alphabetically and it does not allow duplicate items to be added. Can anyone help take a look and see what's wrong with my code? Javascript Code: function addAnotherOption()
{
var newItem = document.getElementById("Text44");
if (!newItem.value == "")
{
var answer = confirm ("Are you sure you want to add? ")
if (answer)//if answer is true
{
var lst = document.getElementById('comboBox'); // listbox control id
// Now we need to create a new 'option' tag to add to MyListbox
var newOption = document.createElement("option");
newOption.value = newItem.value; // The value that this option will have
newOption.innerHTML = newItem.value; // The displayed text inside of the <option> tags
for (var i = 0; i < lst.options.length; i++)
{
arrTexts = lst.options[i].text;
if (arrTexts.toLowerCase() == newItem.toLowerCase())
{
alert ("That option is already included in the list - please enter another item.");
return false;
}
else
{
// Finally, add the new option to the listbox
lst.appendChild(newOption);
//sort items in listbox in alpha order
arrTexts = new Array();
for(i=0; i<lst.length; i++)
{
arrTexts[i] = lst.options[i].text;
}
arrTexts.sort();
for(i=0; i<lst.length; i++)
{
lst.options[i].text = arrTexts[i];
lst.options[i].value = arrTexts[i];
}
}
}
}
}
else
{
if(newItem.value == "")
{
alert("Key something to textbox please.");
}
else
alert("Cancelled.");
}
}
HTML Code: <input id="Text44" type="text" />
<input id="Submit22" type="submit" value="Add" onclick="addAnotherOption()" /><br />
<select name="combo" id= "comboBox" style="width: 323px">
<option value="H">Hearts</option>
<option value="D">Diamonds</option>
<option value="C">Clubs</option>
<option value="S">Spades</option>
</select>
So I'm working with a code that I can't seem to get the translation to show up in the text area. The user is supposed to enter text in a text area on the left hand side, hit the translation button, and the translation will appear like a sentence in the right hand text area. I don't seem to be able to get anything to show up in the right hand text area........ I know that i'ts probably something very simple that I am not seeing because at this point I am brain dead. Code: phrases = [["hello","ahoy"],["pardon me","aaarrgghh"],["excuse me","aarrr"],
["hows it going","hows it goin"],["sir","matey"],["madam","proud beauty"],
["woman","beauty"],["children","sprogs"],["where is","whar be"],
["can you help me find","know ye"],
["is that","be that"],["how far is it to?","how many leagues to"],
["the","th'"],["my","me"],["your","yer"],["there","thar"],
["outstanding","outstandin"],["attractive","attractive"],["happy","horny"],
["dead","went t' Davy Jones' locker"],["restroom","head"],["restaurant","galley"],
["hotel","fleabag inn"],["pub","pub"],["I would like to","I be needin' t"],
["I desire","I desire"],["I wish I knew how to","I'm a hankerin' t"],
["my mother told me to","MeAhoy! ol' mum, bless her black soul, always tol' me t"],
["have a great dinner","have a great what crawled out o' t' bung hole"],
["have a cocktail","swill a pint or two o' grog"],["fall on the ground","fall on t' ground"],
["get drunk","get splice t' mainbrace"]];
function Translate(text)
{
for(var i = 0; i < phrases.length; i++)
{
var toReplace = new RegExp("\\b"+ phrases[i][0]+"\\b", "i");
var index = text.search(toReplace);
while(index != -1)
{
text = text.replace(toReplace, phrases[i][1]);
index = text.search(toReplace);
}
}
return text;
}
Code: <div> <textarea id="first_text" style="float:left" id="task_list" rows="20" cols="53"></textarea> <button id="translated" width="50px" heigth="100px" ><img src="pirate2.gif" />Translation----></button> <textarea id="second_text" style="float:right" id="task_list" rows="20" cols="53"></textarea> </div> I am looking for a simple script or I hope it seems. I need the script to function like this: [text box] insert telephone number here in format like this xxx-xxx-xxxx but once the number is entered I would like for it to auto detect the area code and in a box or just as text to the right or left I would like for it to display the state that the area code corresponds with. I am using a set of predetermined area codes that I can enter myself once I am made aware of the script. IF this is possible then I would greatly appreciate the help! HI to all I am new be and not able to resolve the issue when i tries to edit text area everything works fine for crome and ie but does not work for firefox in fire fox when i try to edit intially everythings works fine but if i click other feild in form and after that try to edit text area backspace key stuck up and does not work please help me ?? code which i am using is menitoned below function stopPropagation(e) { e = e||event; /* get IE event ( not passed ) */ e.stopPropagation? e.stopPropagation() : e.cancelBubble = true; } function checkShortcut(e) { stopPropagation(e); if({8:1,13:1}[e.keycode||e.which]) { if( x ) return true; return false; } } Hi, this is my first post here, and i am wanting some guidance on how to make a calculator for my website... basically the website will sell laminate/ wooden flooring and I would like to create a piece of code that when the user enters the room dimensions (i.e width and length) it would tell the user how much they would need to purchase to cover this area.. maybe I could also include the pack size for a more accurate guidance as to what they would need to buy Many websites that sell flooring have this built into there websites and I wondered if this has been hard coded by the website developer or has been incorporated by a piece of open free-ware that can be obtained and then implemented into the site. Thanks and any guidance, help would greatly be appreciated. - Nath Hi everyone, Hoping someone could assist me? I want information from a text filed that is submited to actually appear in a particular area of the website itself instantly - not sure if this can be achieved via java or html? EG: TEXT: Hi, my name is such and such Then for that to be submitted and to appear on the top right side of the website? Can anyone assist me? Kind Regards, I am really new to JavaScript, and was following a tutorial that was using everything inline (probaby as its less confusing for the noob). Now I want to split it off into a script area, like my CSS has been. I have: Code: <SPAN onclick="document.getElementById('glance').style.display='block';document.getElementById('front').style.display='none';">
Is something like this valid (this is a guess BTW)? Code: <SCRIPT type="text/javascript">
function getElementById('glance') {
.style.display='block';
}
function getElementById('front') {
.style.display='none';
}
</SCRIPT>
<SPAN onclick="document.getElementById('glance'); document.getElementById('front')"> ... </SPAN>
... or should function be document in the script area and document not be present in the SPAN attribute? ... Better yet, is there a way to put both the 'glance' and 'front' together like this: Code: <SCRIPT type="text/javascript">
function getElementById ('glance') {
.style.display='block';
getElementById ('front') {
.style.display='none';
}
}
</SCRIPT>
I have a need to display, edit and save the contents of a text area to a text file or what ever is best suited, directly to the website root or folder within the root of the site. Is there anyway this can be done with out database software? As I dont have the option to install mysql or any other software to the webserver. Any help would be greatly appreciated. Thx Just a little backround: The webserver is acually an open source linux firewall which i was able to edit the apache config file to host a second site. I just want the ability to store edit and display some network information within a very small site I made without the use of a database. Is this even possible? |
|||||||