JavaScript - Using Onload Instead Of Onclick
Hi Guys,
I want to call the below when the page opens as opposed to clicking a link How do I alter it and do i need a function? THANKS <a href="#" onclick="new Lightbox.base('box3', { closeOnOverlayClick : true })">LINK Similar TutorialsHi, I'm working on a small bit of code that passes a logged in users email address and name to a live chat form (Zompim & WHMCS) http://api.zopim.com/#setName By striping the code from the above page, I've managed to get it to work when the link is clicked, but I needed to have the variables passed upon page load. If anyone can point me in the right direction that would be great, me and Javascript don't work too well together! Here is what I have so far http://myautodj.com/zomp_test.php (your request a chat, and click on the run script link - that passes the demo email and name) Here is the code Code: <pre><script> $zopim.livechat.set({ language: 'en', name: 'Visitor', email: 'visitor@site.com', onStatus: function(s) { alert(s) } }); </script></pre> <script> (function() { var pres = document.getElementsByTagName('pre'), i; for (i=0; i<pres.length; i++) { buildLiveExample(pres[i]); } function buildLiveExample(p) { var code = p.innerHTML.replace(/>/g, '>').replace(/</g, '<'); var div = document.createElement('div'); if (code.search('<script>') == 0) { var a = document.createElement('a'); a.innerHTML = 'run script'; a.href = '#'; a.onclick = function() { eval(code.replace(/<\/?script>/g, '')); return false; }; div.appendChild(a); } else { div.innerHTML = code.replace(/<script>[\s\S]*?<\/script>/g, '') var code_blocks = code.match(/<script>[\s\S]*?<\/script>/g); if (code_blocks) { for (var i=0; i<code_blocks.length; i++) eval(code_blocks[i].replace(/<\/?script>/g, '')); } } p.parentNode.insertBefore(div, p); } })() </script> <script type="text/javascript"> document.write(unescape("%3Cscript src='" + document.location.protocol + "//zopim.com/?4vXfkefMFbxeWAVPjvRvWnBodfrGzctq' charset='utf-8' type='text/javascript'%3E%3C/script%3E")); </script> hi all im trying to hide a div on page load, ive used this. Code: <script type="text/javascript"> function hideDiv(){ document.getElementById('sidebar').style.display = "none"; } hideDiv() </script> and this in the body tag Code: <body onload="javascript:hideDiv()"> it works fine hiding the div named sidebar, problem comes when i try to then use an Onclick event to show the hidden div, it just wont show. can this be done? please help if you can this work has to be in soon Hello all, I am new here and have a question about a AP Div I am using as a dropin. It drops in when the page loads and I would like it to only drop in if a visitor clicks a link I designate as the dropin link. Can someone please tell me how to accomplish this? I am pasting in the js file and I will also need to know how to set up the "a href" link to call the dropin! Thanks is advance for any help you may give! Code: // JavaScript Document var ie=document.all var dom=document.getElementById var ns4=document.layers var calunits=document.layers? "" : "px" var bouncelimit=32 //(must be divisible by 8) var direction="up" function initbox(){ if (!dom&&!ie&&!ns4) return crossobj=(dom)?document.getElementById("dropin").style : ie? document.all.dropin : document.dropin scroll_top=(ie)? truebody().scrollTop : window.pageYOffset crossobj.top=scroll_top-250+calunits crossobj.visibility=(dom||ie)? "visible" : "show" dropstart=setInterval("dropin()",50) } function dropin(){ scroll_top=(ie)? truebody().scrollTop : window.pageYOffset if (parseInt(crossobj.top)<100+scroll_top) crossobj.top=parseInt(crossobj.top)+40+calunits else{ clearInterval(dropstart) bouncestart=setInterval("bouncein()",50) } } function bouncein(){ crossobj.top=parseInt(crossobj.top)-bouncelimit+calunits if (bouncelimit<0) bouncelimit+=8 bouncelimit=bouncelimit*-1 if (bouncelimit==0){ clearInterval(bouncestart) } } function dismissbox(){ if (window.bouncestart) clearInterval(bouncestart) crossobj.visibility="hidden" } function truebody(){ return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body } window.onload=window.setTimeout(initbox,5000); Hello Can anyone help with the following problem On the following page http://www.stroudskittles.co.uk/signingon.html I have a Body onload event (to load the chained Menu) and a windows.onload event (to load the IFrame Ticker) If I open the page in Internet explorer both scripts function; however in Firefox I'm having problems. The Chained Menu works, however the IFrame Ticker does not display. Both events ahave ben placed on the boady tag. Can anyone advise how I can get both to display in Firefox Can anyone I'm currently working on a project and I am doing a bunch of image switching. I'm having a problem with the following... I have seven medium image objects and one small one. One is at the top and the other 7 are below. When one of the 7 is clicked, it then becomes the one up top and the one up top then takes the place of the image clicked. This needs to be able to happen no matter which of the seven i click. Also when you click one of the seven it runs a script to change 9 other images in the center of the page. this isnt too important because i have it working already. What i have is, each of the seven images run their function that changes the 9 center images and then it runs another function. What i need is for that function to determine which company for example(shaws, lowes, target) the top image belongs to and replace the image that was clicked with the top one. But i also need to replace the NAME="" and ONCLICK="function()" with the proper ones for the original company up top. Please if you can understand what im trying to do let me know, if you need further clarification i can do so. i can draw a picture of what im trying to do or the layout if needed but i cant necessarily show anyone the project due to a non-disclosure. Is it possible disable an onclick after clicking it and then enable it from another onclick by id Code: <img id="one" href="images/homepage/sliders/bonus_button.jpg" style="position:relative; top:30px; left:50px; height:30px; width:70px; float:left;"> This code runs when it is clicked: Code: $("#one").click(function() { runEffectB(); return false; }); What I would like to happen is for either runEffectB() to not run if it was just run or to disable the #one.click once it has run. I am assuming I will be able to re-enable it from another onclick running a similar function. This is jquery and jquery ui if that helps. Any ideas much appreciated. I have this code: Code: <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4c7b22470e521876"></script> I want this JavaScript code above to be executed when all My page finished loading (maybe by using JavaScript onload) So how can I do that? Hi, I'm looking to create a box that shows to IE6 users or lower, to tell them that my site does not render properly in the IE6 browser and that they should therefore upgrade to a newer version or alternative browser. Basically I would put whatever the code to show the box into these tags: Code: <!--[if lte IE 6]> INSERT HERE <![endif]--> to enable it to only appear to IE6 or below users. Preferably when this box appeared, it would be nice if it could fade the page behind it. Does anyone have a script for this or know of a tutorial I could use? The box would also need buttons at the bottom that said "Ok, upgrade me" (this would load another window with links to alternative browsers) or "No thanks" (or "Close") Thanks in advance. Am I saying the onload event wrong or something? PHP Code: <input type="button" value="Mouse" onload="popup_show('popup', 'popup_drag', 'popup_exit', 'mouse', -10, -10);" /> Other events like onmouseover and onClick work Hi all I would like the img src to be populated after page load I'm not sure this is doing what I would like it to do. I have done this. (tag shortened for post) Code: <img src="" id="testImg2" onload="(this.src='images/USA.jpg')"/> Is this populating the img src after page load or when the img tag is loaded? LT Hi, I am trying to give the user the option of music on my homepage (b/c we've all found it annoying at times...perhaps most times). I have found an "onload" option for the body tag on dotnetspider.com, but it doesn't seem to be working for me. Please take a look and let me know of any improvements I could make. Thx Code: <body onload="loadMusic()"> <p> <script type="text/javascript"><!-- function loadMusic() { var r=confirm("Would you like a background tune?"); if (r==true) { <input type="button" onclick="show_confirm()" value="Show a confirm box" /> <object class="plugin_video" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="480" width="640"> <param name="autoplay" value="false" /><embed title="QuickTime" hidden="true" src="sounds/siteBG.wav" mce_src="sounds/siteBG.wav" autoplay="true" loop="true" controller="true"></embed> </object> } else { alert("If you change your mind reload the page to choose again."); // --></script> Hi all, I have some javascript that when a link is clicked hides the div and when it is clicked again shows the div... what I want to do is reverse that, so it is intially hidden. I have tried changing the display none to different parts but it always shows on load: Code: function toggleDiv (divid) { if (document.getElementById (divid).style.display == 'none') { document.getElementById (divid).style.display = 'block'; } else { document.getElementById (divid).style.display = 'none'; } } Code: <a href="javascript:;" class="showmorelink" onmousedown="toggleDiv('checks');">Safeguarding</a> Can anyone advise? Many thanks, Greens85 Hei, On my website , I have certain things that happen in the function window.onload. I need them to happen only the first time when the user acceses the page . Do you have any idea how to do this? Thanks Hi, I got some JavaScript code from the net to resize DIV's depending on the window-size. It works perfectly in FF, but it won't work in IE. Code: function Resize(){ var winW = 630, winH = 460; if (parseInt(navigator.appVersion)>3) { if (navigator.appName=="Netscape") { winW = window.innerWidth-30; winH = window.innerHeight-200; } if (navigator.appName.indexOf("Microsoft")!=-1) { winW = document.body.offsetWidth-30; winH = document.body.offsetHeight-200; } } var topHeight = document.getElementById('top').offsetHeight; var setHeight = document.getElementById('settings').offsetHeight; var headersHeight = document.getElementById('headers').offsetHeight; var leftWidth = document.getElementById('left_column').offsetWidth; document.getElementById('container').style.width=winW+"px"; document.getElementById('container').style.height=(winH-topHeight-setHeight)+"px"; document.getElementById('headers').style.width=(winW-leftWidth)+"px"; document.getElementById('data').style.width=(winW-leftWidth)+"px"; document.getElementById('data').style.height=(winH-topHeight-setHeight-headersHeight)+"px"; } I've been working on this for some days. I would appreciate any help I can get. Erik while decomplicating things I putted into single jsp code like that: Code: <script language="javascript" src="../js/A.js" type="text/javascript"> </script> <script language="javascript" src="../js/B.js" type="text/javascript"> </script> The prob here is that both A and B contains window.onload, and only the one from A gets executed. All things that come to my mind is back to complications, loosing track of things. Any advice ? Hi I am in need of some help with my Javascript code, basicly I am creating a Javascript SDK for my site and I am trying to make is a little like jQuery in which you check if the document is ready such as $('document').ready(function(){}); which my SDK looks like this $.functions.push(function(){}); the only thing is when using it like this each function push gets added to the functions array which i then need to use on the documents load. With my SDK I use $.onload.ready();, which should act as window.onload and run all the functions with-in the array but I cant seem to get it to work. This is what I currently have. Code: $.functions =new Array(); $.onload = {}; $.onload.ready = function(){ if(window.onload !== undefined && window.onload != '') { window.onload=function(){for(var i=0;i<$.functions.length;i++){$.functions[i];}}; } }; Can anyone help me out? Thank You DJCMBear EDIT: Don't worry I have found the solution and it works! This is the code for the onload. Code: $.onloadAdd = function(func) { if(typeof onload == 'function') { var oldonload = onload; onload = function() { oldonload(); func(); } } else { onload = func; } }; $.onload = function(){ if(window.onload !== undefined && window.onload != '') { for(var i=0;i<arguments.length;i++) { $.onloadAdd(arguments[i]); } } }; And this is the onload functions that get added to the list to be run. Code: $.onload(function(){if($.Class('Listener')){for(i=0;i<$.Class('Listener').length;i++){$.Class('Listener')[i].onclick=function(){alert($.getInfo(this).innerHTML);};}}},function(){if($.Class('Add')){for(i=0;i<$.Class('Add').length;i++){$.Class('Add')[i].innerHTML=$.Class('Add')[i].innerHTML+'...';}}}); I am using this code Code: <BODY onload="window.top.location='http://localtimes.info/clock.php?cp3_Hex=0F0200&cp2_Hex=FFFFFF&cp1_Hex=000080&fwdt=118&ham=0&hbg=0&hfg=0&sid=&mon=&wek=&wkf=&sep=&continent=Asia&country=Indonesia&city=Jakarta&widget_number=116'"> but the problem is that when the page containing this code loads, it redirects Me to the page (a new page) of the JavaScript code, So how to make this JavaScript code load on the same page and not redirecting Me to a New page? (and make it load when the all page finish loading) Hi everyone, I am at the last leg of getting my code to run. I have a window.onload function, but right now it is working only when I fill in all the field in the drop down list, hit a refresh and then hit submit button. What changes should I implement in the code? The code after the window.onload function runs as follows: Code: window.onload = function() { age = 0; groom_age = getvalues(); caste = 0; groom_caste = getvalues_1(); profession = 0; groom_profession = getvalues_2(); bachelor = 0; groom_bachelor = getvalues_3(); master = 0; groom_master = getvalues_4(); doc = 0; groom_doc = getvalues_5(); country = 0; groom_country = getvalues_6(); color = 0; groom_color = getvalues_7(); height = 0; groom_height = getvalues_8(); marriage = 0; groom_marriage = getvalues_9(); father = 0; groom_father = getvalues_10(); switch(groom_age) { case "23" : age = 1.6; break; case "24" : age = 1.2; break; case "25" : age = 1.7; break; case "26" : age = 1.8; break; case "27" : age = 1.9; break; case "28" : age = 1.75; break; case "29" : age = 1.7; break; case "30" : age = 1.4; break; case "31-35" : age = 1.8; break; case "36-40" : age = 1.9; break; case "41-45" : age = 1.75; break; case "46-50" : age = 1.7; break; case "51+" : age = 1.4; break; default: age = 1; } switch(groom_caste) { case "Brahmin" : caste = 1.6; break; case "Bania" : caste = 1.2; break; case "Kayastha" : caste = 1.6; break; case "Kshatriya" : caste = 2.0; break; case "Dalit" : caste = 1.8; break; case "Maravar" : caste = 1.6; break; case "Mudaliar" : caste = 2.0; break; case "Jat" : caste = 1.8; break; case "Labanas" : caste = 1.6; break; case "Rajput" : caste = 1.6; break; default : caste = 1; } switch(groom_profession) { case "Engineer" : profession = 1.6; break; case "Doctor" : profession = 1.2; break; case "Lawyer" : profession = 1.65; break; case "CA" : profession = 1.7; break; case "IAS" : profession = 2.0; break; case "Family Business" : profession = 1.5; break; case "Engineer + MBA" : profession = 1.95; break; case "None of the above" : profession = 1.95; break; default: profession = 1; } switch(groom_bachelor) { case "BTech/BE/BS" : bachelor = 1.6; break; case "MBBS" : bachelor = 1.2; break; case "BA" : bachelor = 1.1; break; case "B.Com" : bachelor = 1.4; break; case "BSc" : bachelor = 1.9; break; case "BBA" : bachelor = 1.1; break; case "Diploma" : bachelor = 1.4; break; case "Certification Course" : bachelor = 1.4; break; default: bachelor = 1; } switch(groom_master) { case "MS" : master = 1.6; break; case "MBA" : master = 1.2; break; case "MHA" : master = 1.4; break; case "MTech" : master = 1.4; break; case "M.Ed" : master = 1.4; break; case "No Master degree" : master = 1.4; break; default: master = 1; } switch(groom_doc) { case "Doctor of Philosophy (Phd)" : doc = 1.6; break; case "Doctor of Medicine (MD)" : doc = 1.2; break; case "No Doctorate Degree" : doc = 1.4; break; default: doc = 1; } switch(groom_country) { case "India" : country = 1.6; break; case "USA" : country = 1.2; break; case "Any European Country" : country = 1.7; break; case "Australia" : country = 1.7; break; case "Canada" : country = 1.7; break; case "Any Country more developed than India" : country = 1.7; break; case "Any Country less developed than India" : country = 1.2; break; default: country = 1; } switch(groom_color) { case "Fairy White" : color = 1.6; break; case "Black" : color= 1.2; break; case "Wheatish (Almost White. Would need some Fair n Lovely)" : color= 1.4; break; case "Brown": color= 1.4; break; case "White": color= 1.9; break; case "Pitch Black (Not visible on a moonless night)" : color= 0.6; break; default: color = 1; } switch(groom_height) { case 'Less than 5\'4"' : height = 1.6; break; case '5\'4"' : height = 1.2; break; case '5\'5"' : height = 0.8; break; case '5\'6"' : height = 1.0; break; case '5\'7"' : height = 1.4; break; case '5\'8"' : height = 1.5; break; case '5\'9"' : height = 1.6; break; case '5\'10"' : height = 1.7; break; case '5\'11"' : height = 1.8; break; case '6' : height = 1.85; break; case '6\'1"' : height = 1.9; break; case 'Greater than 6\'1"' : height = 1.8; break; default: height = 1; } switch(groom_marriage) { case "0" : marriage = 1.6; break; case "1" : marriage = 1.2; break; case "2" : marriage = 0.4; break; case "More than 2" : marriage = 0.2; break; default: marriage = 1; } switch(groom_father) { case "Doctor" : father= 1.6; break; case "IAS" : father = 1.2; break; case "Engineer" : father= 1.7; break; case "Lawyer" : father= 1.65; break; case "CA" : father= 1.8; break; case "Engineer + MBA" : father= 1.9; break; case "Family Business" : father= 1.2; break; default : father = 1; } }; function processOrder() { var total = age + caste + bachelor + master + doc + color + profession + father + marriage + height + country; var pageNumber = Math.floor((20 - total) / 2 + 1); // pageNumber = 6; // alert(pageNumber); window.open ("Page " + pageNumber + ".html"); } </script> <center> <INPUT TYPE="button" VALUE="Calculate" onClick="processOrder()"> </center> I would really appreciate any kind of help. Thanks a lot! rethink
All, I have a function that loads with the onload command. Is there a subsitute for this? I have an AJAX call so sometimes content gets loaded on the page without the onload event being triggered but I need it to go to this function when the AJAX displays the new content. Any ideas? If it makes a difference, the AJAX is calling a PHP page. Thanks in advance. |