JavaScript - 2 Onloads In Body Tag
i had to put to onload commands in a body tag and now only one will work. is there any way to make both work?
Similar TutorialsHi, Sorry to ask this while others have too, but the answers for them didn't work for me and I really know nothing when it comes to JS. I have a portfolio page that had an onload so that the first image of the thumbnails would automatically load with the page. Worked fine. I added some bells and whistles and now it doesn't work. The bells and whistles being a NiftyCorner JS and an expandable menu. The menu works, but the other two, both with the onload command won't work. I've tried a semicolon between them in all the possible configurations that I can think of and yet no luck. Here's the code...let me know if you need this to be live and I'll push it. Thanks in advance!!! Code: <style type="text/css"></style> <link rel="stylesheet" type="text/css" href="css/design.css" /> <script language="JavaScript" type="text/JavaScript"></script> <script type="text/javascript" src="niftycube.js"></script> <script type="text/javascript"> window.onload=function(){Nifty("div#p7TMM_1","big" );}</script> <link href="p7tmm/p7TMM10.css" rel="stylesheet" type="text/css" media="all" /> <script type="text/javascript" src="p7tmm/p7TMMscripts.js"></script> <script language="JavaScript" type="text/JavaScript"> <!-- //This is the script to take querystrings from the URL and convert them into //a Javascript array. "?search=whatever" becomes querystring["search"] //this loads the portion of the url containing the querystring, and also //decodes any special character codes var que = unescape(location.search); //gets value of querystring var que = que.substring(que.lastIndexOf("=") + 1); var layer = 'Div' + que //toggle between layers - on/off function toggleBox(szDivID, iState) // 1 visible, 0 hidden { var obj = document.layers ? document.layers[szDivID] : document.getElementById ? document.getElementById(szDivID).style : document.all[szDivID].style; obj.visibility = document.layers ? (iState ? "show" : "hide") : (iState ? "visible" : "hidden"); } //--> </script> </head> <body onload="javascript: toggleBox(layer,1);"> hi guys, how can i get this code to load on body onload? without fading in and out? Code: <html> <head> <!-- For ease i'm just using a JQuery version hosted by JQuery- you can download any version and link to it locally --> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function() { $("#responsecontainer").load("response.php"); var refreshId = setInterval(function() { $("#responsecontainer").load('response.php?randval='+ Math.random()); }, 9000); $.ajaxSetup({ cache: false }); }); </script> </head> <body> <div id="responsecontainer"> </div> </body> Thanks this: Code: <body onload="pack = 'Original';recoger_mapa_url();" onkeydown="pulsar_tecla(event, 'onkeypress');" onkeypress="pulsar_tecla(event, 'onkeydown');"> [/CODE] to this: Code: pack = 'Original'; recoger_mapa_url(); window.onkeydown = pulsar_tecla(window.event, 'onkeypress'); window.onkeypress= pulsar_tecla(window.event, 'onkeydown'); does not work(event is undefined). Suggestions ? Hello, How can i get scroll bar position of body tag ? Thanks in advance. Hi, is it possible to have a different background image on IE to firefox, I am doing my background image as shown below: Code: <body style="background-image: url(unbranded_bg.png);"> however I want script that says if IE, show unbranded_bg2.png and if firefox show unbranded_bg.png. Many Thanks, Simon i cannot understand, am i making the same mistake each time but my <body onload="startChecking()"> does not want to load again?? here my full code: Code: <head> <script language="JavaScript" type="text/javascript"> var sendReq; var receiveReq; var lastmessage = 0; var mTimer; function startChecking() { receiveReq = new XMLHttpRequest(); console.log("1234"); getNewMessage(); } function getNewMessage() { if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { console.log(receiveReq.readyState); } mTimer = setTimeout('getNewMessage();',30000); } </script> </head> <body onload="startChecking()"> //more code here </body> i just want the console.logs to execute then i will continue with the rest of my code... please help? thank you I found a little chat script online and I wanted to check it out. When I integrated it into a page I created, for some reason this will not work correctly <body onload="setInterval('chat.update()', 1000)"> I tested it with two different browswers open Lets say on two different browser windows you have user1 and user2 if user1 types 'Hello' it will not show up on user2 window but if user2 types 'Hi' then on user2 window it will say user1 says Hello user2 says Hi so basically for user1 to see what user2 has wrote, user1 has to type something first and send it to see what user2 said. hope you understand, if you would like I could post up the code. I'm trying to implement saving the document.body.scrollTop value and then restoring it but the restore does not work. The SetScrollLocation() alert line is empty. The save alert() lines displays a value so its saving the scrollTop but it seems to loose the value on the SetScrollLocation() call. I'm saving on an OnClick event and then restoring when the form reloads from a refresh. PHP Code: function SaveScrollLocation () { document.forms[0].frm_body_hidden.value = document.body.scrollTop; alert(document.forms[0].frm_body_hidden.value); } function SetScrollLocation () { alert(document.forms[0].frm_body_hidden.value); document.body.scrolltop = document.forms[0].frm_body_hidden.value; } Hi, Is there any alternative to the ' body onload="" ' function? I have on the page several scripts running and one is blocking the others because of the body onload function. It is working if I change that to body onfocus but it is loading the content all over when the user gets back to the page. Any ideas how can I avoid this? I can't apply onload to some element, onfocus is not working and this code also does not suite me: Code: <script type="text/javascript> function(); </script> Thanks in any case! Batric Hi my code returns all the html of the iframe. I would like just the body html. Any one know how to amend to suit? Code: alert( $("#uploaderIframe").contents()[0].documentElement.innerHTML ); I am pretty new to JavaScript, so I apologize if this is a stupid mistake. I am using this code, but trying to have several slideshows on the page. I have set up two to test it, and one works while the other just displays a static image. What is the best way to do this? Do I need to repeat the script code in the head? Thanks in advance for any help.
This code not work, Code: if( document.body.scrollTop() > 200 ) { $( '.navigation' ).addClass( 'fixed' ); } else { $( '.navigation' ).removeClass( 'fixed' ); } I want it to work without jQuery, because half my site die's when i use jQuery, jsut want a simple scrollTop script for when im 200px from top it locks navigation fixed top the top, it works with jQuery but not without and been trying for hours to get it to work, any help would be kindly recieve thanks. Before <body> bunch of codes </body> After <body> <div id="trololol"></div> bunch of codes </body> What I mean is that my <body> tag currently is like this: Code: <body class="page-course"> I would like to insert a pop-up contact form which requires the body tag to be like this: Code: <body onload="javascript:fg_hideform('fg_formContainer','fg_backgroundpopup');"> Not quite sure how to merge these - indeed can I merge them? Perhaps better to make the body class (top example) execute elsewhere? THANKS!! The only way I know to make a script automatically run on the page is by using the "onLoad" property of the HTML body tag. However, I'm working with a template that serves the same header and footer for every page on my site, and this JavaScript is only needed on a single page. I therefore don't really want to edit the body tag with a function call that won't be needed in most cases. To avoid doing this, is there any other way to make a piece of JavaScript run without input from the user? All I want to do is autofocus on a form field. Thanks for any advice. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <script language="javascript" type="text/javascript"> alert (document.body); </script> </head> <body> </body> </html> EDIT: moved script to after body, and now it works. Not the way it should be done I think ? I am a novice with Javascript and need help. The homepage of the website I am developing includes a simple javascript slideshow. The code for the script came from a different site that allowed code sharing. It functions wonderfully once loaded. However, in Internet Explorer, I must control-click to allow for the script to run. This wouldn't be a huge problem, but it is an inconvenience to visitors of the site. Since the website is for a public high school, the district computers have a high security setting. Therefore, anyone trying to access the site from a school computer (the main clientele) will have to control-click and allow access everytime they wish to visit the site. Not ideal. I know my problem is that I am using <body onload="runSlideShow">. I have tried including the defer attribute, but that did not work. Is there any other way I can write the code to not cause viewers to control-click everytime the page is loaded? Thanks tons! EDIT---- When opened in IE 7, there is a bar that warns againsts scripts and activex. I understand that I can lower my personal security setting, but I don't have the authority to do so for district PCs. Once a user clicks to allow the script the slideshow begins automatically. So, how can I write the code so that the warning bar does not show up? ---- Here's the bit of code that is applicable. Code: <script language="JavaScript"> var slideShowSpeed = 4000; var crossFadeDuration = 4; var Pic = new Array(); Pic[0] = 'field.jpg' Pic[1] = 'mural3.jpg' Pic[2] = 'cheer1.jpg' Pic[3] = 'Nuncrackers.jpg' Pic[4] = 'soccer4.jpg' Pic[5] = 'radio4.jpg' var t; var j = 0; var p = Pic.length; var preLoad = new Array(); for (i = 0; i < p; i++) { preLoad[i] = new Image(); preLoad[i].src = Pic[i]; } function runSlideShow() { if (document.all) { document.images.SlideShow.style.filter="blendTrans(duration=2)"; document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"; document.images.SlideShow.filters.blendTrans.Apply(); } document.images.SlideShow.src = preLoad[j].src; if (document.all) { document.images.SlideShow.filters.blendTrans.Play(); } j = j + 1; if (j > (p - 1)) j = 0; t = setTimeout('runSlideShow()', slideShowSpeed); } </script> <body onload="runSlideShow()"> <img src="field.jpg" name='SlideShow' width="814" height="300" /> EDIT: Ive actually managed to sort this out. The problem was as simple as the onload in the body tag was overriding the onload script in the header. Combining the two solved the problem. Ive recently been appointed to do some work on my employers website. For now, to hold us over until we can manage a complete re-write, I have been asked to just do a little update to the look and feel. One of the things I have done is use the niftycorners code for rounded divs. I have had no trouble implementing this code over all the site pages, until I got to one page. Our product pages. Ive never seen a code placed directly within the body tag, but this is what has been done here. <BODY onload="pricing_init(); attribute_changed();"> This code loads the dynamic pricing feature. Unfortunately, it also causes the nifty corners code I have placed between the head tags to fail. I dont know if its just the odd placement of the code or the code itself as I am just learning js (using the Javascript and Ajax for dummies book). Is there some way I can alter this so that both the dynamic pricing and nifty corners works? thanks in advance for any suggestions. I am very new to learning JavaScript and I already seem to have come across a problem. I can get Scripts to work fine in the <body> but not all scripts seem to work in the <head> For example, this works fine: Code: <html> <body> <p id="date"></p> <script type="text/javascript"> <!-- document.getElementById('date').innerHTML = Date(); //--> </script> </body> </html> However, it won't work if I place the script in the head like this: Code: <html> <head> <script type="text/javascript"> <!-- document.getElementById('date').innerHTML = Date(); //--> </script> </head> <body> <p id="date"></p> </body> </html> It could just be that I broke one of the fundamental laws of coding that I don't know or something but like I said, I've only just started JavaScript. Also, the tutorial I have isn't to clear on the differences between using the <head> or the <body>. Just kinda says you can do both. I'd like to use the <head> wherever possible because it would be so much neater to keep all the JavaScript in one place and all the HTML in another. Pretty much like you can do with CSS. Anyway, I'd be much grateful if somebody can explain this to me. I am having a time trying to figure out why my code erases all of my content, and only renders the document.write code. I want to use this inside my html and php so customers will be informed of minimum purchases for free delivery. Any help is appreciated. Code: <html> <title>Title Page</title> <head> <script type="text/javascript"> function getCookie(zip) { var i,x,y,ARRcookies=document.cookie.split(";"); for (i=0;i<ARRcookies.length;i++) { x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("=")); y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1); x=x.replace(/^\s+|\s+$/g,""); if (x==zip) { return unescape(y); } } } function setCookie(zip,value,exdays) { var exdate=new Date(); exdate.setDate(exdate.getDate() + exdays); var zip_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString()); document.cookie=zip + "=" + zip_value; } <!-- Function to Change Zip-Code, or empty cookie !--> </script> </head> <style> .container{ position: relative; width: 1000px; margin: 0 auto; } .left{ width: 200px; background: #EEEEEE; position: absolute; top: 0px; height: 50px; } .middle{ width: 600px; background: #CCCCCC; margin-left: auto; margin-right: auto; height: 300px; } .right{ width: 200px; background: #FCFCEC; position: absolute; top: 50px; height: 250px; } </style> <body onload="checkCookie()"> <div class="container"> <div class="middle">Hello Main Content Area<br> This is the main area, all the bull is going on here. </div> <div class="left">Hello Lefty</div> <div class="right">This is where I want the document.write output to be... <script> function checkCookie() { var zipcode=getCookie("zipcode"); if (zipcode!=null && zipcode!="") { document.write("Zip-Code: " + zipcode); if (zipcode==33820) document.write("<br> Minimum purchase for delivery is: <br>$300.00"); else if (zipcode==33920) document.write("<br> Minimum purchase for delivery is: <br>$235.00"); else if (zipcode==34216) document.write("<br> Minimum purchase for delivery is: <br>$150.00"); else if (zipcode==33572) document.write("<br> Minimum purchase for delivery is: <br>$150.00"); else if (zipcode==32712) document.write("<br> Minimum purchase for delivery is: <br>$300.00"); else if (zipcode==34679) document.write("<br> Minimum purchase for delivery is: <br>$150.00"); else if (zipcode==33823) document.write("<br> Minimum purchase for delivery is: $300.00"); else if (zipcode==33827) document.write("<br> Delivery by Common Carrier"); else document.write("<br> Please call Melco at: 1-800-950-3722"); } else { zipcode=prompt("Please enter your Zip-Code:","");window.location.reload(); if (zipcode!=null && zipcode!="") { setCookie("zipcode",zipcode,365); } } } function deletecook() { var d = new Date(); document.cookie = "v0=1;expires=" + d.toGMTString() + ";" + ";"; } </script> <a href="javascript:deletecook();">Change Location</a> </div></div> </body> </html> |