JavaScript - Help On A Javascript (slot Machine).
Hi to all,
I'm having a problem deciphering this script. This is a 3 image slot machine script(I guess) Can someone explain to me how this code works? And how can I make it show the same result? here it goes: Quote: var chaosMachineSpinCtr = 0; function chaos_machine_attempt(params) { params.on_start(params); $.post(params.post_url, {}, function(data) { var ret = JSON.parse(data); spinResults = ret.spin_results; chaosMachineSpinCtr = 0; chaos_machine_spin_slot(params, ret); }); } function chaos_machine_spin_slot(params, ret) { spinResults = ret.spin_results; if(chaosMachineSpinCtr < 25) { $('#'+params.ul_id+' li[rel=1] > img').attr('src', params.images[array_rand(params.images)]); } else if(chaosMachineSpinCtr == 25) { $('#'+params.ul_id+' li[rel=1] > img').attr('src', spinResults.images[0]); } if(chaosMachineSpinCtr >= 25 && chaosMachineSpinCtr < 50) { $('#'+params.ul_id+' li[rel=2] > img').attr('src', params.images[array_rand(params.images)]); } else if(chaosMachineSpinCtr == 50) { $('#'+params.ul_id+' li[rel=2] > img').attr('src', spinResults.images[1]); } if(chaosMachineSpinCtr >= 50 && chaosMachineSpinCtr < 75) { $('#'+params.ul_id+' li[rel=3] > img').attr('src', params.images[array_rand(params.images)]); } else if(chaosMachineSpinCtr == 75) { $('#'+params.ul_id+' li[rel=3] > img').attr('src', spinResults.images[2]); } chaosMachineSpinCtr++; if(chaosMachineSpinCtr <= 75) { setTimeout(function() {chaos_machine_spin_slot(params, ret);}, 50); } else { params.on_end(params, ret); } } Similar TutorialsHey I'm trying to make a slot machine effect in JS - i had an ajax example but was far too complicated to manipulate to communicate with my server so im working from ground up. The way ive done it is simple html and a submit button. But i want the submit button to first create a "rolling through the images" affect like a slot machine does - then stop left to right in that order (basically like a slot machine does). Now this is beyond what i know in JS but i then also want it to know the result of the images store them into an array and push it to my PHP so i can process it on my server. Is this even possible ? And has any one ever tried such a thing because im stuck but really wish to make this for my gaming website. Hope you can help! I'm doing this project for class and I got to a point where i am stuck and need some help on how to move forward, I don't want straight up answers but some advice or some code to get me started would be much appreciated. Thanks. This is what i need to do with what I have While a smart casino owner knows better than to allow negative bankrolls, most casinos are not above extending personal loans to gamblers who are down on their luck. Augment your slots.html page so that it has capabilities for extending loans to the player when they run out of money. Your page should have an additional text box keeping track of the player's debt (initially $0). Instead of just alerting the player when they try to play with no money, the page should give the user the option to obtain a loan. Use a select box for this with options for a $1, $5, $10, or $20 loan. The loan should only be available when the user is out of money, so you will need to initially set the disable attribute of the select box to "true" in order to disable it (see the snippet below for a starting point). When the user runs out of money, you can enable the select box by setting this attribute to "false". And this is what I have... Code: <html> <!-- This page simulates a slot machine. --> <!-- ================================================= --> <head> <title> Online Slots </title> <script type="text/javascript" src="http://dave-reed.com/book/random.js"> </script> <script type="text/javascript"> bankroll=20; bankroll=parseFloat(bankroll); loanctr=0; loanctr=parseFloat(loanctr); function DoSpin() // Assumes: the page contains an image (slot1) // Results: displays a random spin as the slot1 image { if (bankroll == 0) { alert ("You have no money left. Consider taking out a loan."); } else { var pick; pick = RandomOneOf(["cherry.jpg", "lemon.jpg", "bar.jpg", "donut.jpg"]); document.getElementById('slot1').src = "http://dave-reed.com/book/Images/" + pick; var picktwo; picktwo = RandomOneOf(["cherry.jpg", "lemon.jpg", "bar.jpg", "donut.jpg"]); document.getElementById('slot2').src = "http://dave-reed.com/book/Images/" + picktwo; var pickthree; pickthree = RandomOneOf(["cherry.jpg", "lemon.jpg", "bar.jpg", "donut.jpg"]); document.getElementById('slot3').src = "http://dave-reed.com/book/Images/" + pickthree; if (pick == picktwo && pick == pickthree) { alert ("Winner!"); bankroll = bankroll + 1; } else { bankroll = bankroll - 1; } } } </script> </head> <body> <div style="text-align:center"> <img id="slot1" alt="slot image" border=2 src="http://dave-reed.com/book/Images/cherry.jpg" /> <img id="slot2" alt="slot image" border=2 src="http://dave-reed.com/book/Images/cherry.jpg" /> <img id="slot3" alt="slot image" border=2 src="http://dave-reed.com/book/Images/cherry.jpg" /> <br /><br /> <input type="button" value="Click to Spin" onclick="DoSpin(); document.getElementById('earnings').value = bankroll;" /> <br /><br /> <input type = "text" id= "earnings" size = "10" value= "" onfocus="blur();"/> <br /><br /> Take out a loan of <select id="loan" disabled="true" onchange="document.getElementById('loan').value = loanctr;"> <option selected="selected" value=""></option> <option value="1">1</option> <option value="5">5</option> <option value="10">10</option> <option value="20">20</option> </select> dollars. <br /><br /> <input type = "text" id= "loan" size = "10" value= "" onfocus="blur();"/> </div> </body> </html> Hi - I have an ASP.Net 4.0 solution that runs fine on a Windows 2008 server. However, I've just been given a new Windows 7 64-bit machine to use as my development machine and I'm having a problem with one of my aspx pages. This page has some javascript on it, which runs fine, but then it gets to the following code: Code: <script type="text/javascript"> //<![CDATA[ var theForm = document.forms['aspnetForm']; if (!theForm) { theForm = document.aspnetForm; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } //]]> </script> This not code that I've written; it's code that's generated client-side that I see as I'm debugging my app in Visual Studio 2010 (trying to figure out what the $^#$ is going on). At any rate, once this code completes, the app does nothing. The debugger should take me to some server-side code, but it doesn't. It just sits there. The result is that the page doesn't do what it's supposed to do (no inserts to databases, no success messages, no nothing). As I said, this problem is restricted to my W7 64-bit machine; it runs fine on W2008. Other pages with javascript in the same solution work fine on my W7 machine. I found a post (http://dopostback.net/index.php/net-...anel-problems/) that discusses a similar issue within an UpdatePanel, but I'm not using UpdatePanel. My page does have hidden controls on it, but so do other pages that work just fine. Does anyone know what could be causing this? Thanks! Hi - firstly, apologies for the generic nature of this question, I'm sure I will have some more specific questions later into this project! I'm a complete newbie to javascript and would like to know if it is possible to create a vertical spinning bar like on a fruit machine, that contains a number of images. I would like the bar to have the following behaviour. 1. on the mouse being above the centre point of the bar, the images scroll upwards 2. on the mouse being below the centre point of the bar, the images scroll downwards 3. the further you are from the centre point - the faster the bar scrolls 4. when you hover an image - the bar stops, the image lightens a shade and a link is displayed below the image. My initial thought is to contain the bar in a div and have javascript actions applied to it depending on the mouse position within the div - the actions will change the positions of the image contained in the div. Would be great if anyone knew some code that does a similar thing - or could give me some pointers to start me off. Thanks : ) Hi Everyone, I'm trying to allow a user to select an XML file so that my javascript can parse it and create some pins for a google map. It works fine in Firefox, and by using FireBug I can see that the file is being accessed as expected. IE on the other hand tells me that "'files.0' is null or not an object" on line 68 of address-locator.php... PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Address Locator</title> <style type="text/css"> #map_canvas { width:690px; height:400px; float: left; clear: right; margin: 0px auto 10px 20px; } </style> <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> var map = null; var geocoder = null; var establishmentList; // holds the XML list of all the establishments var mapPins = []; // holds a listing of all the map pins google.load('maps', '3', { other_params: 'sensor=false' }); google.setOnLoadCallback(gmapInit); // initialize the google map function gmapInit() { var latlng = new google.maps.LatLng(42.204799,-111.619917); // 45.332245,-99.507536 center of north america var myOptions = { zoom: 4, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } // includes all the information needed to create a pin with a pop up window function mapPin(pinName, pinAddress, pinPhone, pinWebsite, pinLat, pinLng, geocodeSuccess){ this.pName = pinName; this.pAddress = pinAddress; this.pPhone = pinPhone; this.pWebsite = pinWebsite; this.pLat = pinLat; this.pLng = pinLng; this.success = geocodeSuccess; } // gets the lat and lng of an address and adds a pin to the mapPins array. function getLocation(theName, theAddress, thePhoneNumber, theWebsite){ /* geocoder = new google.maps.Geocoder(); geocoder.geocode({'address': theAddress}, function(results, status){ if (status == google.maps.GeocoderStatus.OK) { mapPins.push(new mapPin(theName, theAddress, thePhoneNumber, theWebsite, results[0].geometry.location, true)); } else { mapPins.push(new mapPin(theName, theAddress, thePhoneNumber, theWebsite, 0, 0, false)); alert("Geocode was not successful for the following reason: " + status); } }); */ // remove after working mapPins.push(new mapPin(theName, theAddress, thePhoneNumber, theWebsite, 42.204799, -111.619917, true)); // end removing code } /* loadAddressFile() * opens an XML file which contains descriptions (names), addresses, phone numbers, * and websites for a business and loads the pertetinent information into the global * variable establishmentList. Starts the call chain to have the data processed */ function loadAddressFile() { // open the file selected by the user var finput = document.getElementById("userAddressFile"); var theFile = finput.files[0]; if (theFile) { var fileReader = new FileReader(); fileReader.onload = function(e){ var xmlDoc; // parse (or load) the xml into xmlDoc. if (window.DOMParser){ parser = new DOMParser(); xmlDoc = parser.parseFromString(e.target.result,"text/xml"); } else { // Internet Explorer xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.loadXML(e.target.result); } // listing of the establishments establishmentList = xmlDoc.getElementsByTagName("establishment"); processEstablishment(0, 1000); } fileReader.readAsText(theFile); } else { alert("Failed to load file"); } } // checks to see if the index parameter is less than the length of the list of establishments and processes the establishment at that index in the list if it is. function processEstablishment(index, delay){ if(index < establishmentList.length){ // data from the XML file var theName = establishmentList[index].getElementsByTagName("name")[0].textContent; var theAddress = establishmentList[index].getElementsByTagName("address")[0].textContent; var thePhoneNumber = establishmentList[index].getElementsByTagName("phone")[0].textContent; var theWebsite = establishmentList[index].getElementsByTagName("website")[0].textContent; // get the current addresses geocoding and add the pin to the list getLocation(theName, theAddress, thePhoneNumber, theWebsite); // check to see if the attempt was successfull - if it was not and we are denied our data - increase the hold time and retry the previous attempt if(!mapPins[index].success){ index--; delay += 5000; } // attempt (or re-attempt) the next establishment window.setTimeout(function() { processEstablishment(index+1, delay); document.getElementById("data").innerHTML += mapPins[mapPins.length-1].pName + "<br />"; }, delay); } } </script> <!-- open the file of addresses if it exists and create a javascript array of the addresses --> </head> <body> <!-- This page is set up to allow the user to load an XML file which contains information about businesses and creates the data required to locate that business on a map --> <div id="map_canvas"></div> <div style="clear:left"> <div style="float:left"> <!-- User the file type to allow the user to select the file, then pass this information to javascript via accessing userAddressFile via document.getElementById("userAddressFile") in loadAddressFile() above --> <form id="addresses" action="address-locator.php" method="post" enctype="multipart/form-data"> Select file: <input name="userAddressFile" id="userAddressFile" type="file" /> <input value="Upload" type="button" onclick="loadAddressFile()" /> </form> </div> <div id="data" style="clear:left"></div> </div> </body> </html> and a sampling of the XML file I'm loading: Code: <?xml version="1.0" encoding="UTF-8"?> <barList> <establishment> <name>21-Seven Bar and Grill</name> <address>217 E Street,Davis, CA</address> <phone>530.757.1733</phone> <website>http://www.myspace.com/21seven_davis</website> </establishment> <establishment> <name>Beach Hut Deli</name> <address>109 E Street, Davis, CA</address> <phone>530.758.7873</phone> <website>http://www.beachhutdeli.com/</website> </establishment> <establishment> <name>Bistro 33 Davis</name> <address>226 F Street, Davis, CA</address> <phone>530.756.4556</phone> <website>www.bistro33.com</website> </establishment> </barList> I've spent the entire afternoon in Goo-gle-land - so any help is most appreciated! If I've missed anything or you have any questions please let me know. Thanks in advance! Dave. Hello! I am trying to find a script that allows you to open multiple browser tabs and then close each of those tabs, either one by one or all at once. Does anyone know how to do this please? Thanks so much for your help. I want to have another go at Javascript. I have several books on the subject but I find that my eyesight is a major problem. Therefore I want to try an on-line solution, preferably free. I have Googled, but there are so many that I am almost dizzy with the choices. Perhaps someone could recommend one. Not too fussy visually. My knowledge is VERY basic. Frank Does anyone know how to make URL links that use Javascript still work when users have Javascript disabled on their browser? The only reason I'm using JS on a URL is because my link opens a PDF file, and I'm forcing it not to cache so users have the latest version. I tried the <script><noscript> tags, but I'm not sure if I'm using it correctly, as my URL completely disappears. Below is my HTML/Javascript code: <p class="download"> <script type="text/javascript">document.write("<span style=\"text-decoration: underline;\"><a href=\"javascript:void(0);\" onclick=\"window.open( 'http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf?nocache='+ Math.floor( Math.random()*11 ) );\" >The Child Magazines Media Kit</a></span> (PDF 1 MB) ");</script> <noscript><span style="text-decoration: underline;"><a href="http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf" >The Child Magazines Media Kit</a></span> (PDF 1 MB)</noscript> </p> Thanks for any help, Michael Hi Guys, I am new at JavaScript and start to do some tutorials.What I am trying to do here is prompting user to input a name and if the name was valid the page(document) will display with all objects like the button.But if user enter a wrong name then the button will be disabled! I create the following code but it did not work <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script language="JavaScript" type=""> function changeColor(){ document.bgColor = "Gray"; } </script> </head> <body> <script language="JavaScript" type="text/javascript"> var person = ""; person = prompt('What is Your Name:'); if (person == "Foo") { document.write("<h1 />Welcome " + person); document.bgColor = "Yellow"; } else { document.write("<h1 />Access Denied!!!!"); document.bgColor = "Red"; document.getElementById("gree").disabled = true; } </script> <div> <p/><input id="gree" type="button" value="Gray " onClick="changeColor();"> </div> </body> </html> as you can see I used the: document.getElementById("gree").disabled = true; but it did not work , could you please give an idea how I can solve this problem? Thanks Hi, I have the following code snippet: test.html ====== <script language="javascript" type="text/javascript"> var testVariable = "test"; </script> <script language="javascript" type="text/javascript" src="test.js"> </script> test.js ===== var testVariable = window.top.testVariable; In firefox, I'm able to access testvariable defined within test.html in test.js. But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html. Can any one please let me know how i can make it work in chrome?. Am i missing something here?. I got an index.php Code: <html> <form action="bacakomik.php" method='post'> <select name="kodekomik"> <option value='../komik1/|23'>Judul Komik1</option> <option value="../komik2/|20">Judul Komik2</option> <option value="../komik3/|10">Juduk Komik3</option> <option value="../komik4/|20">Judul Komik4</option> </select> <input type="submit" /> </form> <?php echo ('<select>'); echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>'); echo ('</select>'); ?> </html> As you can see, each of the option brings specific value "../komik1/|23" komik1 is a directory | is a delimiter 23 is the pages in one chapter and can be considered also as how many images are there on a specific directory This is my bacakomik.php Code: <?php $dirkomik = $_POST['kodekomik']; $exploded = explode("|", $dirkomik); echo ($exploded[0]); //picture directory echo ("<br>"); echo ($exploded[1]); //total page in the comic $pagecount = (int)$exploded[1]; //Take last posted value, process it right away echo ('<FORM name="guideform"> '); echo ('<select name="guidelinks">'); $i=1; do { echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>'); $i= $i+1; }while($i <= $pagecount); //Printing option and select echo ("</select>"); ?> <input type="button" name="go" value="Go!" onClick="document.getElementById('im').src=document.guideform.guidelinks.options[document.guideform.guidelinks.selectedIndex].value+'.png';"> </FORM> <img src="img0.jpg" id="im"> With the current code on bacakomik.php, I only can change the img src of id "im" in the same directory only. What I want is that the Javascript could "add" the "$exploded[0]" variable so that the picture can be loaded from different directory. Anyone can do this? I believe that the fix should be somewhere on input tag inside OnClick, or do you know where? Anyway, I found this on the net http://p2p.wrox.com/php-faqs/11606-q...avascript.html Please help me to those who can... Hey, I've got to make the values of some textboxes change the co-ordinates of my sprite on a canvas and havent a clue on how to do it, Here is my form with the two textboxes and submit button: <form> x: <input type="text" name="x" /><br /> y: <input type="text" name:"y" /><br /> <input type="submit" value="Submit"/><br /> </form> And i need it so that they change the values of these: //this shows where my sprite will start on the canvas var block_x; var block_y; searched the internet for hours and cant really find anything i understand or works. any help is much appreciated I want to insert this js snippet Code: function addText(smiley) { document.getElementById('message').value += " " + smiley + " "; document.getElementById('message').focus(); return false; } to a loaded iframe with name&id chtifrm. I can access it & change embed something in its html via using something like: Code: $(parent.chtifrm.document.body).append('<div id=\"smly\" style=\"cursor:pointer;float:left;top:200px;display:none;position:absolute;\"><\/div>'); .... Code: parent.chtifrm.document.getElementById('chatbox_option_disco').style.display == 'none' but how do I insert js in the head of loaded iframe? Hi Guys I am trying to modify the functionality of my page. I want to be able to activate this piece of code using another javascript function. This is the code I want to activate: Code: <script type="text/javascript"><!-- $('#button-cart').bind('click', function() { $.ajax({ url: 'index.php?route=checkout/cart/update', type: 'post', data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea, .date_data input[type=\'text\']'), dataType: 'json', success: function(json) { $('.success, .warning, .attention, information, .error').remove(); if (json['error']) { if (json['error']['warning']) { $('#notification').html('<div class="warning" style="display: none;">' + json['error']['warning'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>'); $('.warning').fadeIn('slow'); } for (i in json['error']) { $('#option-' + i).after('<span class="error">' + json['error'][i] + '</span>'); } } if (json['success']) { $('#notification').html('<div class="success" style="display: none;">' + json['success'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>'); $('.success').fadeIn('slow'); $('#cart_total').html(json['total']); $('html, body').animate({ scrollTop: 0 }, 'slow'); } } }); }); //--></script> And this is how I want the format of the function to be: function testsession() { if there is a session called 'hiredate' { activate the script above } else { var el = document.getElementById("product_data"); } } I just dont know how to write this in javascript Could you help me if possible please All -- I have a JavaScript config file called gameSetting.js which contains a bunch of variables which configures a particular game. I also have a shared JavaScript library which uses the variables in gameSetting.js, which I include like so: <script type="text/javascript" src="gameSetting.js" ></script> <script type="text/javascript" src="gameLibrary.js" ></script> In gameSetting.js I have: $(document).ready(function() { // call some functions / classes in gameLibrary.js } in Firefox, Safari, and Chrome, this works fine. However, in IE, when it's parsing gameSetting.js, it complains that the functions that live in gameLibrary.js aren't defined. When it gets to parsing gameLibrary.js, the variables in gameSetting.js are reported as not being defined. I've tried dynamically bootstrapping the gameLibrary file using this function in document.ready for dynamic load... $.getScript("gameLibrary.js"); However, the same problem still happens in IE, where when it parses the files individually it's not taking into context the file/variables that came before, so it's not an out of load order problem. My options a 1) collapsing all the functions in gameLibrary.js and variables in gameSetting.js into one file. However, this is not practical because this is dealing with literally hundreds of games, and having a gameLibrary.js in ONE location for ONE update is what makes most logical sense. 2) figure out a way to get this to work where variables in file1 are accessible to file2 in IE (as it seems they are in other browsers). jQuery seems to be able to have multiple plugins that all refer to the based jQuery-1.3.2.js, so I know there is a way to get this to work. Help appreciated. Nero I wrote a log function that took note of various function calls. Thinking that functions are first class objects, and objects have properties, I made the name of each logged function a property of that function, e.g., brightenInnerPara.name = "brightenInnerPara"; Every browser I tried (Firefox, MSIE, Opera, Chrome, Safari) accepted the assignment, no problem. In Firefox and MSIE, the result was what I wanted: brightenInnerPara.name == "brightenInnerPara" But in the others, the result was: brightenInnerPara.name == null Question 1. Which Javascript is correct here? I favor Firefox and MSIE, not merely because they were willing to give me what I wanted, but also because it makes no sense to accept an assignment statement without throwing an error and then give it a null semantics, like Chrome, Opera, and Safari did. I found a workaround, using assignments like this: brightenInnerPara.prototype.name = "brightenInnerPara"; To my surprise, that worked in every browser. But I don't know why. It seems that such assignments are enough to cause each function to have its own distinct prototype. Question 2. Just how inefficient is my workaround, and why does it work? Hey guys I know this might have been discussed before but i can't find it anywhere. I'm trying to write javascript with javascript.... simple right well the problem is in my script i have javascript writing the </script> line like this Code: <script type="text/javascript"> if (!Array.prototype.forEach) { Array.prototype.forEach = function(fun, thisp) { var len = this.length; if (typeof fun != "function") throw new TypeError(); var thisp = arguments[1]; for (var i = 0; i < len; i++) { if (i in this) fun.call(thisp, this[i], i, this); } }; } var typeArray = function (x) { document.writeln('<script type="text/javascript">observe(x); </script> '); } var myArray = [1,2,3,4,5]; myArray.forEach(typeArray); </script> When this code is ran it ends at the first </script> tag and you see all the code after it as just text. i need this code to work because the function observe(); is an observer and has to be in the code for each instance of x. but when the </script> tag is written, even inside the "" it ends the code. Is there any way to write the </script> tag inside of javascript without ending the code?? Hi I am trying to remove spaces from the 'username' field but leave the spaces in the first and last name fields. The below code removes *one* space from the string but no more. Code: <html> <head> <title> </title> <script language="javascript"> function makename() { var firstname = document.mine.firstname.value; var lastname = document.mine.lastname.value; var username = firstname + "." + lastname; document.mine.username.value = (username.replace(" ", "")); } </script> </head> <body> <form name="mine" method="post"> UserName <input type="text" name="username" readonly/> <br />First Name <input type="text" name="firstname" onkeyup="makename()"/> <br />Last Name <input type="text" name="lastname" onkeyup="makename()" /> <p><input type="submit" /> </form> </body> </html> I am thinking I need to run a do, while loop eg. Code: do { document.mine.username.value = (username.replace(" ","")); } while (username still contains space) But I am not sure how to define username still contains space I am pretty sure this requires javascript, but right now my coding skills are next to none, but I am trying to teach myself, but for now I still have no idea what I am doing. So here is my problem. I have a site with fairly large images because I am working with a fluid layout, and the background is such that it cannot repeat well, so I placed a loader on the first page so that it can load all the images. I am also using html5 to animate a curtain up the screen, but because of the load time when a user first visits the site, the won't see that animation. Is there anyway that I can pass the amount of time it took to load the site into the delay section of html code. Here is the site: www.franklyon.info Thanks so much! hello wj friends please help in javascript. i figured out all problem and got solution but one i can't figure out please help me the problem is see this link http://www.sajeebgroup.com in this page see right side update news box. a slider is sliding but before one slider another slide is coming why this. here is slide javascript code PHP Code: (function($) { $.fn.easySlider = function(options){ // default configuration properties var defaults = { prevId: 'prevBtn', prevText: 'Previous', nextId: 'nextBtn', nextText: 'Next', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 2000, continuous: false, numeric: false, numericId: 'controls' }; var options = $.extend(defaults, options); this.each(function() { var obj = $(this); var s = $("li", obj).length; var w = $("li", obj).width(); var h = $("li", obj).height(); var clickable = true; obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); if(options.continuous){ $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px")); $("ul", obj).append($("ul li:nth-child(2)", obj).clone()); $("ul", obj).css('width',(s+1)*w); }; if(!options.vertical) $("li", obj).css('float','left'); if(options.controlsShow){ var html = options.controlsBefore; if(options.numeric){ html += '<ol id="'+ options.numericId +'"></ol>'; } else { if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>'; html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>'; html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>'; if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>'; }; html += options.controlsAfter; $(obj).after(html); }; if(options.numeric){ for(var i=0;i<s;i++){ $(document.createElement("li")) .attr('id',options.numericId + (i+1)) .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>') .appendTo($("#"+ options.numericId)) .click(function(){ animate($("a",$(this)).attr('rel'),true); }); }; } else { $("a","#"+options.nextId).click(function(){ animate("next",true); }); $("a","#"+options.prevId).click(function(){ animate("prev",true); }); $("a","#"+options.firstId).click(function(){ animate("first",true); }); $("a","#"+options.lastId).click(function(){ animate("last",true); }); }; function setCurrent(i){ i = parseInt(i)+1; $("li", "#" + options.numericId).removeClass("current"); $("li#" + options.numericId + i).addClass("current"); }; function adjust(){ if(t>ts) t=0; if(t<0) t=ts; if(!options.vertical) { $("ul",obj).css("margin-left",(t*w*-1)); } else { $("ul",obj).css("margin-left",(t*h*-1)); } clickable = true; if(options.numeric) setCurrent(t); }; function animate(dir,clicked){ if (clickable){ clickable = false; var ot = t; switch(dir){ case "next": t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1; break; case "prev": t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1; break; case "first": t = 0; break; case "last": t = ts; break; default: t = dir; break; }; var diff = Math.abs(ot-t); var speed = diff*options.speed; if(!options.vertical) { p = (t*w*-1); $("ul",obj).animate( { marginLeft: p }, { queue:false, duration:speed, complete:adjust } ); } else { p = (t*h*-1); $("ul",obj).animate( { marginTop: p }, { queue:false, duration:speed, complete:adjust } ); }; if(!options.continuous && options.controlsFade){ if(t==ts){ $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); } else { $("a","#"+options.nextId).show(); $("a","#"+options.lastId).show(); }; if(t==0){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); } else { $("a","#"+options.prevId).show(); $("a","#"+options.firstId).show(); }; }; if(clicked) clearTimeout(timeout); if(options.auto && dir=="next" && !clicked){; timeout = setTimeout(function(){ animate("next",false); },diff*options.speed+options.pause); }; }; }; // init var timeout; if(options.auto){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; if(options.numeric) setCurrent(0); if(!options.continuous && options.controlsFade){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); }; }); }; })(jQuery); here is php to show slide PHP Code: <html. <head> <style type="text/css"> #ticker-container { position:relative; /*overflow:hidden;*/ width: 190px; height: 200px; padding-top:0px; color:#000000; margin-top:0px; margin-bottom:1px; } #ticker { position:relative; overflow:hidden; margin-left:50px; margin-right:20px; margin-top:25px; width:155px; padding:0px; } </style> <!-- SLIDER START --> <script type="text/javascript" src="robin/easyslider/js/jquery.js"></script> <script type="text/javascript" src="robin/easyslider/js/easySlider.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#ticker").easySlider({ auto: true, continuous: true }); }); </script> <link href="robin/easyslider/css/screen.css" rel="stylesheet" type="text/css" media="screen" /> </script> </head> <body> <div id="ticker-container"> <div id="ticker"> <ul> <?php include("robin/notice/config.php"); $query = "SELECT id, title,body,name FROM notice"; $result = mysql_query($query); $num = mysql_num_rows($result); while ($row = mysql_fetch_assoc($result)) { $name = $row['name']; echo '<li><a href="robin/notice/fullarticle.php?id='.$row["id"].'" rel="popup standard 700 600 noicon"><img src="kcfinder/upload/.thumbs/images/'.$name.'" width="150px" height="150px" /></a></li>'; } ?> </ul> </div> </div> </body> </html> please help |