|
JavaScript - Percent Bar, From Where It Should Be Not From Load
hi guys, i have some code, that is a percent bar that changes colour, it works fine, aprt from when i refresh the page and its still going, the bar resets back to the start, if anyone could help that would be great:
there is some php inside the javascript, to pick up the time left. that should be clear but if not its this: the java script is this: PHP Code: ".maketime2($fetch2->lastcrime)." Code: <script language='JavaScript' type='text/javascript' src='/js/countDown.js'></script>
<script>
var sl = 60;
var ts = 60;
var r = 125;
var g = 0;
var b = 0;
function updBar(f){
var percent = 1 - (sl / ts);
var bar = document.getElementById('percentBar');
if(percent < .5){ g += 125 / ts * 2; }
else { r -= 125 / ts * 2; }
if(r < .1) r = 0;
bar.style.backgroundColor = 'rgb(' + Math.round(r) + ',' + Math.round(g) + ',' + Math.round(b) + ')';
bar.style.width = 300 * percent;
sl -= 1;
if(sl >= 0) setTimeout('updBar()', 1000);
else document.getElementById('recovering').style.display = 'none';
}
var no_timeleft = 'None';
//bootloaderAdd('countDown()');
bootloaderAdd('updBar()');
bootloaderOn();
</script>
<div id='recovering'>
<table width=400 cellspacing=0 cellpadding=2 class=sub2>
<tr>
<td height=100 align=center valign=center>
You are currently recovering from your previous crime...<br><br>
<span id='timeleft' style='font-size:16px;'>".maketime2($fetch2->lastcrime)."</span><br><br>
<table width='300' style='background-color:#333333;'>
<tr>
<td>
<span style='width:300px; background-color:#333333; text-align:left;'>
<div id='percentBar' style='background-color:rgb(125, 0, 0); font-size:11px; text-align:right; width:0px;'> </div>
</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br><br>
</div>
if your wondering why there are no """ anywhere, its because this javascript is only active when there istime left and is echo'ed out by php. Cheers. Dan Similar TutorialsHi all Is there a way to get the image(s) to load into the table after the page has loaded instead of the way I have it now? I have 4 tabs, but I would like the imgs in tabs 2,3,4 to load after page load. Example of how the tabs look. Code: <div class="tabbertab">
<h2>Australia_____</h2>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FFFFCC">
<caption class="highlight_Red">澳洲 Australia
</caption>
<tr>
<td><a href="pages/promotion.html#aus_ACE" rel="nofollow" target="_blank"><img src="pages/images/Pics/AUS/ace.jpg" alt="ACE / ATTC" width="110" height="69" border="0" align="left" class="ozimg_L"/> ...a few more images etc
the other tabs look the same. LT This script displays a link to a registration/login form that loads in a light box for Joomla. I've been goin nuts trying to figure out how to get this to load on page load with a delay. Anyone know how to get this done? PHP Code: <?php JHTML::_('behavior.mootools'); $document = JFactory::getDocument(); $document->addStyleSheet(JURI::base() . 'media/system/css/modal.css'); $document->addScript(JURI::base() . 'media/system/js/modal.js'); $document->addScriptDeclaration("window.addEvent('domready', function() {SqueezeBox.initialize({});});"); $user = & JFactory::getUser(); $uri = JFactory::getURI(); $url = $uri->toString(); $return = base64_encode($url); ?> <div id="lbframeid" style="position:absolute;top:1px;left:1px;height:0px;width:0px;overflow:hidden"> <a href="http://www.wowjoomla.com/"><h1>Joomla Login LightBox powered by WowJoomla.com</h1> </a> </div> <?php if ($user->get('guest')) :?> <a href="<?php echo JRoute::_('index.php?option=com_loginbox')?>" onclick="SqueezeBox.fromElement(this); return false;" rel="{handler: 'iframe', size: {x: 660, y: 500}}"><?php echo JText::_('SIGNUP_LOGIN')?></a> <?php else: ?> <?php echo JText::sprintf( 'HINAME', $user->get('name') ); ?> <br> <a href="javascript:void(0);" onclick="LB_onLogout(); return false;"><?php echo JText::_('LOGOUT')?></a> <?php endif; ?> <script type="text/javascript"> function LB_onLogout() { var form = new Element('form'); form.setProperty('method', 'POST'); form.setProperty('target', '_self'); form.setProperty('action', 'index.php'); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'option'); input.setProperty('value', 'com_user'); form.appendChild(input); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'task'); input.setProperty('value', 'logout'); form.appendChild(input); var input = new Element('input'); input.setProperty('type', 'hidden'); input.setProperty('name', 'return'); input.setProperty('value', '<?php echo $return; ?>'); form.appendChild(input); $E('body').appendChild(form); form.submit(); } </script> Hi guys, I am trying to insert the following call into my page; Code: <script type="text/javascript" defer="true">
$('#query').autocomplete({
serviceUrl:'service/autocomplete.ashx',
minChars:1,
delimiter: /(,|;)\s*/, // regex or character
maxHeight:400,
width:250,
deferRequestBy: 0, //miliseconds
params: { country:'Yes' }, //aditional parameters
// local autosugest options:
lookup: ['January', 'February', 'March', 'April', 'May'] //local lookup values
});
</script>
It works fine in all browsers except ie(6,7,8) Code: Internet Explorer can not open website. Operation Aborted. I understand it is caused by the jquery autocomplete function loading before the page / DOM has fully loaded. I tried adding Defer="true" to the script however this doesn't seem to work. Could someone please tell me what i must add to the script so that it loads after the dom has fully loaded? Thanks guys George -edit-
Instead of loading the data when the page loads (thus making the page load slower) I wanna make it load when you hover over the tool tip so how would I change this? PHP Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <title>Test Screenname</title> <style type="text/css"> body {color:#000;background-color:#FFF; font-family:Arial, Helvetica, sans-serif;} /*tooltip*/ div.tooltip { width: 200px; color: #fff; text-align: center; } div.tooltip h4 { color: #fff; font-weight: bold; text-shadow: 2px 2px 1px #222; margin: 0; padding: 13px 10px 5px; background: url(img/balloon.png) top left no-repeat !important; background: url(img/balloon.gif) top left no-repeat; font-size: 11px; } div.tooltip p { margin: 0; padding: 0 10px 15px; text-shadow: 2px 2px 1px #222; background: url(img/balloon.png) bottom left no-repeat !important; background: url(img/balloon.gif) bottom left no-repeat; font-size: 10px; } </style> <script type="text/javascript" src="mootools.js"></script> <script type="text/javascript"> window.onload=function() { /* setup tooltips */ var as = []; $S('a').each(function(a){ if (a.getAttribute('title')) as.push(a); }); new Tips(as, {maxOpacity: 0.9, maxTitleChars: 25}); } </script> </head> <body> <a href="#" title=" <?php $url = "http://www.blockstatus.com/aim/status-checker/index.php"; $ch = curl_init(); curl_setopt($ch, CURLOPT_URL,$url); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_POSTFIELDS,"aimac=screenname"); curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_USERAGENT, $_SERVER['HTTP_USER_AGENT']); $result2 = curl_exec ($ch); curl_close ($ch); $data = $result2; $pattern = '/Status:<\/b>(.*?)<br.*?><\/td>/i'; preg_match($pattern, $data, $status); $output = str_replace("Status: ", "", $status[1]); $aimstatus = trim($output); echo "$aimstatus"; ?> ">Test tooltip</a> </body> </html> My webpage won't load at all in Safari, unless I open it as a link from anbother site or if I manually type in the index.html after the url. when I take out the javascript though, it work perfectly. I always works in Firefox though. Any hints: <script type="text/javascript" src="stuff/x_core.js"></script><script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script><script src="stuff/ga.js" type="text/javascript"></script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-*******-*"); pageTracker._trackPageview(); } catch(err) {}</script> <script type="text/javascript"> var start_z_index = 3000; function bringtotop( item ) { item.style.zIndex = start_z_index++; } </script> <script type="text/javascript" src="stuff/x_event.js"></script> <script type="text/javascript" src="stuff/xenabledrag.js"></script> <script type="text/javascript" src="stuff/xenabledrag2.js"></script> Hello, I have been looking for a good walk-through online, but can't seem to find an exact resolution to what I am trying to do. Can someone please supply some example code for not displaying everything that is inside a <div>. Basically I do not want social media content to be displayed on secure pages, but want them on every other page. This is what I have: Code:
<div id="share">
<ul>
<li>
<div class="addthis_toolbox addthis_default_style ">
<a href="http://www.addthis.com/bookmark.php?v=250&username=###### class="addthis_button_compact">Share</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
</div>
</li>
<script>
var addthis_config = {"data_track_clickback":true};
if (document.location.protocol !== 'https:') {
$jq.getScript('http://s7.addthis.com/js/250/addthis_widget.js?username=######', function() { });
}
</script>
</ul>
</div>
hi i have two buttons.. home and aboutus in my page.. and when i click on home i have the content for home inside a html page and i am calling the html file inside this Homepage using javascript(externally calling the html files) Now what i need is, onclick of HOme button.. i have written a code like <a href="main_Home.html" onclick="updateObject(this); return false;"> and the javascript i got from dhtml goodies is <script type="text/javascript"> function updateObject(which){ document.getElementById('one').innerHTML = '<'+'object id="foo" name="foo" type="text/html" data="'+which.href+'"><\/object>'; } </script> now i also need a hide a div on the onclick funtion.. how do i use multiple functions? i need to hide the default homepage content and load the html file there.. Pls help.. I want this script to load after the page load the script is: Code: <script type="text/javascript" src="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"></script> the script in My page is like: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>My test page</title> </head> <body> <h1>Tony</h1> <h2>Welcome Tony Website</h2> <script type="text/javascript" src="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"></script> <h3>Tony is ... and is....</h3> <h3>He will....</h3> </body> </html> So how can I make this script loads after all elements of My page are loaded and without changing it's position (the script position)? Hi to all I have a javascript code that when a page loads, some contents must be load within a given div tag. But the problem is that this javascript code sometimes work an somtimes Not work. What's the problem? Thank You... Hello, I have a page that uses the Yahoo Buzz JS widget which renders a button and count of clicks from Yahoo servers. The display of the widget is at the top of the page - which causes the rest of the page to appear to load slowly (cause it's waiting on the Yahoo JS to finish). Ordinarily, I would place all JS calls at the bottom of the page as not to affect the performance of the rest of the page. But since this JS actually renders an UI element, I don't know how to move the code to the bottom of the page (if I move the JS, the UI widgit appears at the bottom). Any suggestions on how to do this? Code: <div class="swidgets"> <script type="text/javascript" src="http://d.yimg.com/ds/badge2.js" badgetype="square"> http://www.example.com/page.htm </script> </div> I have a banner ad at the top of the page (created by javascript). It is sometimes flash, sometimes a div, sometimes just an image (the ad company determines this). I need it to appear at the top of the page, but I want it to load AFTER all of the rest of the page content has loaded. Here is a test page I've created to demonstrate this: http://jeremymoritz.com/js-test.php Here is the code with the javascript at the bottom so it will load last: Code: <html> <head> </head> <body> <div id='ad_spot'> <!--ad needs to go here--> </div> <div id='content'> <!--Content--> </div> <div id='load_last'> <script defer='defer' type="text/javascript"> var __fbr_pid = "1746"; var __fbr_bid = "18281"; var __fbr_sid = "4568"; var __fbr_size = "728x90"; var __fbr_auid = "28762"; var __fbr_zone = ""; </script> <script type='text/javascript' src='http://ads.foodieblogroll.com'></script> </div> </body> </html> </div> I've tried many things to fix this, but the javascript usually creates elements (iframes, divs, etc.) that are OUTSIDE of container div so manipulating the dom (to move the div or its contents to the <div id='ad_spot'>)has yielded unexpected results. Thank you in advance for your help! Hi, Well this plugin stops working after completely loading the flash content or game. I did a few changes to it but still, it won't show the game after completely loading the flash. Can someone tell me what's wrong? Here is the link to live working example http://files.cryoffalcon.com/Piecema...s/testing.html [CODE] <script language="JavaScript" type="text/javascript"> fuction init(){ document.getElementById("Name_First").value= "<?php echo $cooker[17]?>" ; } window.onload = init; </script> </head> [CODE] <Body onload="init()"> [CODE] i have to set the value of the input area. But it doesn't work. when i see the source of the page when displayed on firefox fuction init(){ document.getElementById("Name_First").value= "Bob Dwight" } I see this, The value is right but this doesnot show in the form. I would like to thank anyone who helps in advance. okay, im using this script to close a DIV, can i somehow link it so that it loads main.swf when the div is closed? Now the SWF is running in the bg. Code: <script language=javascript>
<!--
function hideDiv(){
if(document.getElementById('Div').style.display != "none") { document.getElementById('Div').style.display = "none"; }}
//-->
</script>
Code: <a href=# onclick="javascript:hideDiv();">Close</a> Hi Guys, A client has given me some code but i need to add some code to it so it loads a URL along with the rest of the code. Below is the javascript code i need to work with, i know its to do with Google Tracking (Dart) but i dont understand it as I've never done JavaScript befo Code: <script type="text/javascript">
function dart_tracking(callback) {
// Google Conversion Tracking
var img = new Image();
img.src="
https://www.googleadservices.com/pagead/conversion/REMOVED/?value=0&label=REMOVED&guid=ON&script=0
";
var img2 = new Image();
img2.src="
https://www.googleadservices.com/pagead/conversion/REMOVED/?value=0&label=REMOVED&guid=ON&script=0
";
_gaq.push(['_trackEvent', 'subscribeButton', 'clicked']);
if (typeof callback != "undefined") {
setTimeout(callback, 1500);
}
}
</script>
Now the above code loads up when a subscribe button is clicked on my clients webpage, now how do i go about adding code to this so lets say http://www.Google.co.uk is loaded too? Any help would be great. Thank you! Hello Bit of a nightmare scenario but, the services page isn't loading and from what I can tell, IE 6,7 & 8 are throwing up the same error. It says: Line: 602 Char 5 Error: 'undefined' is null or not an object Code: 0 which refers to: vmlSegments.push('m'); if (glyph.o) { The page is here The script it is referring to is typeface.js: http://typeface.neocracy.org/ Hope someone can be a great help and tell me how I can get page loading again. All the other pages are fine. p.s. I'm not a coder but designer and hoping to get this fixed myself. Thank you. I am a middleware developer for a design and manufacturing software. We recently have gone from using Crystal reports to using xml based reporting. I am just begining to write reports using xsl, css and java script and transforming to html. The report I am working on has several tables each in a separate div. These tables are populated based on the xml file output form a job file. Base on job settings one or more tables may have no information in them. What I would like to do is hide the divs with empty tables when the page is loaded. I have looked through the forums here and on other sites and have found perhaps hundreds of examples of java script for showing and hiding divs with user input or by being set to a hide state by default. However I need it to be more dynamic. I think this can be done with java script but not sure hopefully someone can help me. Thanks PShorty Hey, I'm trying to make a game, I learned how to do so by reading tutorials but the problem is that I do not know how to implement the save/load function into the game, the tutorial surrounding that area was very unclear to me, and here I am... Any tips on how to make this work is greatly appreciated, I wouldn't asked if I hadn't tried my best and every way I could think of. I'm still quite new to coding so... The first piece of code is the game, the second one is what I'm trying to make the game work with. I tried for a while and got the game to reset back to values, but only the values I set in the code so it never actually worked. The tutorial doesn't give any live examples and I really am... not that bright when it comes to coding Sorry and thanks, all inputs are appreciated. I read tutorial from links below, Javascript String Compression | Almost Idle Tutorial for save code Incremental Lesson 9 - For Loops | Almost Idle Tutorial for the game code Code: /*Pleae refer to Lesson 9.txt for a full description on this lesson*/
//The timer to run code every second
var Timer = window.setInterval(function(){Tick()}, 1000);
var buildings = [];
//The object declaration for game saves
function GameSave() {
this.money = 0;
this.buildings = [];
for (var i = 0;i < buildings.length;i++) {
this.buildings[i] = 0;
}
}
//The object declaration for buildings
function Building() {
this.Name = "Lemonade Stand";
this.Cost = 10;
this.PerSec = 1;
}
//The function to initialise all buildings
function InitBuildings() {
LoadBuilding("Lemonade Stand",10,1);
}
//The function to automatically load a building into the buildings array
function LoadBuilding(name,cost,persec) {
var cur = buildings.length;
buildings[cur] = new Building();
buildings[cur].Name = name;
buildings[cur].Cost = cost;
buildings[cur].PerSec = persec;
}
//The function used to gather money
function GatherMoney() {
game.money++; //++ tells javascript to add 1 to the variable
//Display the player's current money
document.getElementById("money").innerHTML = game.money;
}
//The function that gets run every second
function Tick() {
for (var i = 0;i < buildings.length;i++) {
game.money += game.buildings[i] * buildings[i].PerSec;
}
document.getElementById("money").innerHTML = game.money;
}
//The function to buy a lemonade stand
function Build(id) {
if (game.money >= buildings[id].Cost) { //Check if the player has enough money, then subtract it and add a new building if they do
game.money -= buildings[id].Cost;
game.buildings[id] = game.buildings[id] + 1;
document.getElementById("money").innerHTML = game.money;
document.getElementById("Building1Qty").innerHTML = game.buildings[id];
}
}
//Run this code once the page has loaded fully
window.onload = function() {
InitBuildings();
window.game = new GameSave();
};
Code: /*Pleae refer to Compression.txt for a full description on this lesson*/
function NewGame() {
this.name = "Our Game";
this.description = "Our Game's Description";
this.numbers = [];
for (var i=0;i<10;i++) {
this.numbers[i] = i;
}
}
var Game = new NewGame();
window.onload = function() {
var SaveGame = JSON.stringify(Game);
SaveGame = encode_utf8(SaveGame);
SaveGame = lzw_encode(SaveGame);
window.localStorage['SaveName'] = SaveGame;
SaveGame = window.localStorage['SaveName'];
SaveGame = lzw_decode(SaveGame);
SaveGame = decode_utf8(SaveGame);
window.GameTwo = JSON.parse(SaveGame);
document.getElementById("name").innerHTML = "Name: " + GameTwo.name;
document.getElementById("desc").innerHTML = "Description: " + GameTwo.description;
var numbers = "";
for (var i=0;i<10;i++) {
if (numbers.length == 0) {numbers = i;} else {numbers += ", " + i;}
}
document.getElementById("numbers").innerHTML = "Numbers: " + numbers;
}
// LZW-compress a string
function lzw_encode(s) {
var dict = {};
var data = (s + "").split("");
var out = [];
var currChar;
var phrase = data[0];
var code = 256;
for (var i=1; i<data.length; i++) {
currChar=data[i];
if (dict['_' + phrase + currChar] != null) {
phrase += currChar;
}
else {
out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
dict['_' + phrase + currChar] = code;
code++;
phrase=currChar;
}
}
out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
for (var i=0; i<out.length; i++) {
out[i] = String.fromCharCode(out[i]);
}
return out.join("");
}
// Decompress an LZW-encoded string
function lzw_decode(s) {
var dict = {};
var data = (s + "").split("");
var currChar = data[0];
var oldPhrase = currChar;
var out = [currChar];
var code = 256;
var phrase;
for (var i=1; i<data.length; i++) {
var currCode = data[i].charCodeAt(0);
if (currCode < 256) {
phrase = data[i];
}
else {
phrase = dict['_'+currCode] ? dict['_'+currCode] : (oldPhrase + currChar);
}
out.push(phrase);
currChar = phrase.charAt(0);
dict['_'+code] = oldPhrase + currChar;
code++;
oldPhrase = phrase;
}
return out.join("");
}
function encode_utf8(s) {
return unescape(encodeURIComponent(s));
}
function decode_utf8(s) {
return decodeURIComponent(escape(s));
}
Reply With Quote 01-16-2015, 05:52 PM #2 Dormilich View Profile View Forum Posts Senior Coder Join Date Jan 2010 Location Behind the Wall Posts 3,532 Thanks 13 Thanked 372 Times in 368 Posts the problem is that I do not know how to implement the save/load function into the game save it where? that particular question is important as JavaScript has only limited places where it can save something at all. 1) save it on the server => call a server script with the appropriate data (e.g. via AJAX) 2) cookies, very limited storage space, only works on the same browser 3) WebStorage, more space than cookies, but still only the same browser 4) IndexedDB (same as above) I'm trying to create/find a script that will do the following: -load a css file regardless of any conditions. -do not load the css file if a certain text is present in a specified html div tag. i know this is done with a if/else state like this: Code: if (condition)
{
code to be executed if condition is true
}
else
{
code to be executed if condition is not true
}
but I do not know how to add the condition for the variable text and to specify the css file. I want the javascript to ignore loading the css if a div tag like this: Code: <div class="menu-opener"><a class="gwt-Anchor" href="javascript:">Text1<img src=..//img.jpg"></a></div> contains the word Text1, or any other I specify. Else, if any other text inside the div, the css should load normally. I believe this is not difficult for a js knower and I would be very grateful for a solution. |
|||||||