var testString = "1,Jeremy,130,80;2,Lauren,370,300;3,Jeancarlos,200,200;4,Luke,330,70;5,Bloom,392,108";
var testArray = testString.split(";");
for(var i = 0, limit=testArray.length; i < limit; i++)
{
testArray[i] = testArray[i].split(",");
}
hielo 65 Veteran Poster
hielo 65 Veteran Poster
Absolutely no good I'm afraid
Yes of course. Major oversight on my part. Good catch Airshow.
As pointed out, it should have been:
if (form.radChoice[0].checked ){...}
else if (form.radChoice[1].checked ){...} hielo 65 Veteran Poster
On my previous post change line 53: if(!page_index) to: if(null===page_index) if you are having difficulty figuring out the path to your cookie.js file, then try typing the full path in the browser's address bar - ex:
http://www.yoursite.com/scripts/cookies.js
If you see the browser trying to download the js file OR if the browser shows you the content of cookies.js, then that IS the correct path. Once you figure out what is that full path, then use that full path as the src attribute of the script tag.
hielo 65 Veteran Poster
when you have more than one form element with the same name (in your case you have two radio buttons named radChoice) you then need to treat it as an array.
So in your case, on what you posted instead of:
if (form.radChoice.value == "S"){...}you needed:
if (form.radChoice[0].value == "S"){...}similarly, the other check should have been:
else if (form.radChoice[1].value == "N"){...} hielo 65 Veteran Poster
The problem is that the page does not reload a different URL when you refresh the page
that's because on every reload, the code executes again from the top, like it is the very first time it is executing. You need to "maintain" state across refreshes. For this you will need to use cookies.
Refer to the code below. Pay special attention to the HTML comment that starts with IMPORTANT...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<title>Rotate Marketing</title>
<!--
IMPORTANT: Notice that I am importing "cookies.js". Go to:
http://www.quirksmode.org/js/cookies.html
scroll down to the section titled "The Scripts" and grab those three functions.
save them to a file named cookies.js and import them into your page similarly to
the way I am doing below
-->
<script src="cookies.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
var Win;
var page_index = 0;
var page = new Array();
page[ page.length ] = "http://www.homebiz.usaloe.com";
page[ page.length ] = "http://www.makethatmoney.usaloe.com";
page[ page.length ] = "";
page[ page.length ] = "";
page[ page.length ] = "";
page[ page.length ] = "";
page[ page.length ] = "";
page[ page.length ] = "";
var next_page = function(){
//page_index = (( page_index === 8 ) ? 0 : page_index );
page_index=++page_index % page.length;
if ( typeof Win !== "undefined" ) {
Win.location.href = page[ page_index ];
createCookie("lastPage",page_index,30);
}
};
window.onload = function() {
page_index=readCookie("lastPage");
if(!page_index)
{
page_index=0;
}
else
{
page_index=++page_index % page.length;
} … jreddick82 commented: Great bit of help. Thank you +0
hielo 65 Veteran Poster
Where is your implementation for saveUpdateCodes? My guess is that your bug is in that function.
hielo 65 Veteran Poster
on line 17 of your original post, change:
<?to:
<?phpAlternatively, you can enable short tags in your php.ini file. You will need to change:
short_open_tag = Off
to:
short_open_tag = On
hielo 65 Veteran Poster
should be:
btn.onclick = doSomething; hielo 65 Veteran Poster
once the page has finished loading, if you call document.write you "destroy" the current document, and a new document will be created containing the new content you are writing. In your case, the "cellClicked" function exists in the original/old document (before document.write is executed), but since you call document.write via setUpPage after the page has finished loading:
<body onload="setUpPage()">you "destroyed" your cellClicked function. Thus, instead of what you have, try:
...
<body>
<script type="text/javascript">setUpPage ()</script>
</body>
...so that document.write is executed before the original document finishes loading.
VernonDozier commented: Thank you. +11
hielo 65 Veteran Poster
>>Notice how line 24 of my code includes "GET" and not "POST"? That's the call I used to (successfully) send a GET request (as the English above clearly states).
Yes, I can see that, but it is NOT clear if you were doing this:
send_to_host('humbot.freewebhostingpro.com','POST','/index.php?a=5','');which is NOT the correct way to call it. The parameters should not be appended to the uri. Instead you need:
send_to_host('humbot.freewebhostingpro.com','POST','/index.php','a=5');On another note, the source of the problem is:
fputs($fp, "Content-type: application/x-www-form- urlencoded\r\n");there should be NO space between the hyphen and urlencoded. It should be:
fputs($fp, "Content-type: application/x-www-form-urlencoded\r\n"); humbug commented: That last bit of info was my problem. Cheers +4
hielo 65 Veteran Poster
you are passing only three parameters. For post, your third parameter should be only the php script that processes the request(without the querystring parameters) and the fourth parameter should be the "querystring" data. Try:
send_to_host('humbot.freewebhostingpro.com','POST','/index.php','a=5'); hielo 65 Veteran Poster
Use the RegExp contructor. It accepts two arguments:
1. the regular expression pattern
2. reg ex options (g=global, etc)
var _regex = new RegExp( "^" + _inputText.value, "i");NOTE: If your expression were:
var x = /^\d+$/igif you use the RegExp object you will need to escape the slash:
var x = new RegExp("^\\d+$","ig");The same applies for the other shortcuts (\s, \w, etc)
hielo 65 Veteran Poster
If you are not receiving all the data, it's possible your server's POST limit is too low for your needs. If you are using PHP, look for:
; Maximum size of POST data that PHP will accept.
post_max_size = 8M
in your php.ini file and adjust it accordingly
hielo 65 Veteran Poster
another problem you are likely to encounter is that on line 38:
updateAjax();you are NOT passing any parameter to your function. After looking at the start of your function:
function updateAjax(b){
var inputText = b.value;
...
}your function expect an argument (most likely a reference to a form field element). Since you are currently are NOT passing any arguments, b is undefined. Hence:
var inputText = b.value;should give you an error as soon as the request completes.
hielo 65 Veteran Poster
refer to the makePOSTRequest on the following page:
http://www.captain.at/howto-ajax-form-post-request.php
hielo 65 Veteran Poster
on line 34 of the code you posted you are NOT checking to see if the request has completed. The iteration portion of the code you posted looks right, but when you make an ajax request, the onreadystatechange fires multiple times. You need to call your update function only when the request has completed. Try changing line 34 to:
httpRequest.onreadystatechange = function() { if(httpRequest.readyState !=4)return; response = httpRequest.responseText;
if the problem persists, try alerting the length of your json array right after you execute your eval to verify that the string you are returning from your ajax request was actually converted to an object:
var testObj = eval('( '+response+' )');
alert(testObj.results.length);
hielo 65 Veteran Poster
If your fields have names such as "input[]", you do not need to provide any numbers inside the brackets. That naming convention (adding brackets at the end of the field name, is necessary for PHP processing, but on the client-side, those brackets are part of the name). Refer to the full example below:
<!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>Untitled Document</title>
</style>
<script language="JavaScript" type="text/JavaScript">
function toggle(status){
var chk = document.getElementsByName("ad_pages[]");
for(var i=0,limit=chk.length; i < limit; ++i)
{
chk[i].checked = !chk[i].checked;
}
}
</script>
</head>
<body> <form>
<table border="0" align="center" cellpadding="3" cellspacing="3" bgcolor="#F3F3F3">
<tr>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="1" ></label></td>
<td width="180"> English</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="2" ></label></td>
<td width="180">Maths</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="3" ></label></td>
<td width="180">Science</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="4" ></label></td>
<td width="180">Technology</td>
</tr>
</table>
<table width="500" border="0" align="center" cellpadding="5" cellspacing="5">
<tr>
<td><div align="center">
<input name="toggleAll" type=button class="formbutton" onClick="toggle()" value="Toggle All">
</div></td>
</tr>
</table></form>
</body>
</html> hielo 65 Veteran Poster
From your problem description it is not clear if you have a select list within a div ( or some other element) with id="ChtPlc". At any rate, the following code should do what you are aiming if your HTML code is similar to the following:
<div id="ChtPlc">
<select onchange="getInfo();"><option value="1">alpha</option><option value="2">beta</option></select>
</div>Your javascript codewould then be:
var http = createRequestObject();
function createRequestObject(){
var request_=null;
if( window.XMLHttpRequest )
request_ = new XMLHttpRequest();
else if( window.ActiveXObject)
request_ = new ActiveXObject("Microsoft.XMLHTTP");
return request_;
}
function getInfo(){
http.open('GET', 'Rooms_Func.php?id=23');
http.onreadystatechange = handleInfo;
http.send('');
}
function handleInfo(){
if(http.readyState == 4){
var response = document.createTextNode(http.responseText);
document.getElementById('ChtPlc').appendChild(response);
}
} hielo 65 Veteran Poster
Typically the data is stored in a password protected medium. Most of the times it is onto a database and whether all the data is encrypted or not is entirely up to you. For example a nickname may not be as "top secret" as a password or a credit card number, so you may choose not to encrypt it. Thus, you may choose some of the fields on database table, but not necessarily all of them. Of course, if you choose to encrypt everything, your system will be quite secure, but you pay performance price since it takes time to encrypt the data, although on a low volume server you may not notice the impact.
hielo 65 Veteran Poster
For the sake of clarity, let me start out with a couple of examples. If you were to navigate to:
http://www.somesite.com?name=John
the browser contacts that server and sends data without encrypting it(cookies, url parameters, etc). On the other hand if you
navigate to:
https://www.somesite.com?name=John
the browser will encrypt the data sent to the server. Notice the "s" (as in "Secure") in "https".
Thus, you must make sure the html pages or scripts are submitting data via https.
Potential security pitfall: Let's assume that you set up a form at www.somesite.com/page1.htm
and its code is as follows:
<html>...
<form action="page1.php">
<input type="text" value="" name="name"/>
</form>...
</html>If from the home page of the site you provide a link to it as follows:
https://www.somesite.com/page1.html
when the user clicks on it and submits the form, the browser will ultimately submit the form to:
https://www.somesite.com/page1.php
which is a secure form. Since in the "action" attribute you did not specify a protocol nor domain, the browser will "fill in the blank" with whatever is in the browser's address bar at the time. In this case, the form would "inherit" the "https" protocol and the "www.somesite.com" domain.
However, once the user is at https://www.somesite.com/page1.html, there is nothing preventing him/her to edit the protocol to http. Doing so would effectively cause the browser to ultimately send the form to:
http://www.somesite.com/page1.php
…
hielo 65 Veteran Poster
Try this:
$sql="SELECT * FROM users WHERE username='" . $myusername . "' and password='" . $mypassword . "'";
$result=mysql_query($sql);
$info = mysql_fetch_array($result, MYSQL_ASSOC);
// If result matched $myusername and $mypassword, table row must be 1 row
if(count($info)==1){
if ((int)$info['verified'] == 0) {
$url = "notverified.php";
$redirect = "other";
}
elseif ((int)$info['verified'] == 2){
$url = "suspended.php";
$redirect = "other";
}
elseif ($myusername == "10001" && !($redirect == "other"))
{$url = "change.php";
}
elseif (!($myusername == "10001") && !($redirect == "other"))
{$url = "my.php";
}
session_register("myusername");
session_register("mypassword");
}else
{$url = "login.php";}
echo("<script>
<!--
location.replace(\"".$url."\");
-->
</script>"); hielo 65 Veteran Poster
If you insist with the iframes, you may want to look at the following suggestions:
http://www.google.com/search?q=auto-resize+an+iframe&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:en-US:official&client=firefox-a
Also, I don't know what you mean by "..get my div layout back?".
Personally, I would rethink my strategy and use server-side includes. Iframes as too problematic. Think longterm maintenance. Do you want to be running into these unexpected problems every time you update your content? I wouldn't.
Good Luck.
hielo 65 Veteran Poster
Building on what you already have, you would just need to add the desired <span> or <div>, assign it an id, an update that <span> or <div> based on its id value. I have used txt3 on the code below on a <p> tag instead:
<html>
<head>
<title>Key Events Example</title>
<script type="text/javascript">
function handleEvent(e)
{
e = e || window.event;
var FirstTextbox = e.srcElement || e.which;
var SecondTextbox = document.getElementById("txt2");
SecondTextbox.value = FirstTextbox.value;
//this makes a copy of input on txt3, regardless of tag name
document.getElementById("txt3").innerHTML =FirstTextbox.value;
}
</script>
</head>
<body>
<p>Type some characters into the first textbox.</p>
<p>
<input type="textfield" id="txt1"
onkeydown="handleEvent()"
onkeyup="handleEvent()"
onkeypress="handleEvent()" ></input></p>
<p><textarea id="txt2" rows="15" cols="50"></textarea></p>
<p id="txt3"></p>
</body>
</html> hielo 65 Veteran Poster
I think you are looking for the title attribute:
<a href="" title="Look at me"><img src=""/></a>
or:
<a href=""><img src="" title="Look at me"/></a>
It can be used on the <a> and/or the <img> tags.
hielo 65 Veteran Poster
Can you post some code?
Not sure if a background image on the link will fix your problem OR one of a "title" or "alt" attributes on one of the elements you are doing. Hard to troubleshoot without knowing what you are looking at.
hielo 65 Veteran Poster
>>Firefox = doesn't resize the iframe at all
This is not true, it does. At least it does in mine, but it changes only by a few pixels (10 or 15 maybe) that it is hardly noticeable.
The only way to know if the javascript function is truly working is if you alter your code as follows:
the_height=elem.contentWindow.document.body.scrollHeight;
alert(the_height);if the reported height is significant (more than 10 or 15) then the problem is else where. I copied you index.html page, and after viewing it via FF, what you have does work as in IE. Meaning it resizes appropriately, not just an insignificant 10 or 15 pixels. However, on my copy of your test page, I am not importing your css file anywhere:
<link rel="stylesheet" href="css/3col_leftNav.css" type="text/css" />Repeat: I did not use/copy that css file at all AND the code works as expected. Hence, I thought I should begin looking there. I don't know what those css definitions are doing but after copying the file and adjusting the <link href=""> to point to my copy of your CSS file only on index.html, I noticed that it worked as expected on both IE and FF.
I then adjusted the CSS path (<link href="">) on the iframe target pages (home.html, etc), and wham. Problem replicated.
Solution: on the iframe pages, do not import the css file. Since index.html already does so, the css style definitions should propogate to your iframe files since they are all …
hielo 65 Veteran Poster
Try this:
<?xml version="1.0" encoding="UTF-8"?>
<!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>Untitled</title>
<script type="text/javascript"><!--
function sendIt(formElem)
{
if (event.keyCode==13 )
{
formElem.submit();
return true;
}
return false;
}
//--></script>
</head>
<body>
<form action="http://www.somesite.com" onkeypress="sendIt(this)">
<textarea rows="10" cols="70"></textarea>
</form>
</body>
</html> hielo 65 Veteran Poster
Wait a minute, I take that back. I left IE open long enough for the letter to reach the limit (3450), and then I got a pop-up error. The same with FF.
The reason for that is that when letter = 3449,
else if( letter < 3450 ){...}
is true and the content inside {...} is executed. That contents increments letter to 3450. So the next time that timeout calls alterText(), it attempts to execute this first:
underscore = document.getElementById("n" + letter).innerHTML;
since letter is now 3450 an such id does not exist, it throws a runtime error! You must check for the limit first.
Here's the revised code:
function alterText()
{
if(letter < 3450)
{
underscore = document.getElementById("n" + letter).innerHTML;
if(underscore == "_")
{
document.getElementById("n" + letter).innerHTML=" ";
}
else
{
document.getElementById("n" + letter).style.visibility="visible";
document.getElementById("n" + letter++).style.color=genHex();
}
return true;
}
return false;
} hielo 65 Veteran Poster
I looked at http://listenlight.net/13/iijima/ with FF and IE and they behave as shown on the video. Furthermore, my FF debugger is not triggerring any errors.
However, the homepage:
http://listenlight.net/
still does.
hielo 65 Veteran Poster
>> all I need to do for IE at this point is limit the calls to defined id attributes?
Yes
>> I should look at the source of each page, and stop the text engine after it renders the final character on the page?
Not necessarily. I don't know what is your desired effect. If you just want changing colors while loading then the answer is YES.
[This is what I did on post #2 above]
Otherwise, once the 23 character is loaded you just need to reset the variable letter to 0. This will cause the page to continuously re-render the entire string with changing colors.
[This is what I did on post #5 above.]
Both of those posts are complete code that you can simply copy from the posts, save them to your system, and then just run them. Both worked fine for me on FF and IE.
BTW: Try installing the Firebug extenstion for FireFox. Then open your page current page and you will see how the errors just keep accummulating.
tefflox commented: good help +2
hielo 65 Veteran Poster
>>if you go back to alterText, you would realize that there are at most 23 letters. Hence you should not call alterText more than 23 times
because there is no letter with id 24. The largest you have is "L23".
Actually there are 24 letters on "listenlightpoetryjournal", but since you enclosed each of them in a span and the id's were enumerated starting with 0, the last letter has id="n23"
From your original code:
document.getElementById(letter++).style.color=genHex();
this would be problematic when letter increases beyond 23 because there is no (for example):
<span id="n24">?</span> where "?" could be any letter. letter is increased only once when the function alterText() is called, but the real problem is that your code never stopped calling alterText(). This is because setInterval() acts like an alarm clock. The first argument would be sort of the beep/tune that the clock will play, and the second argument would be time between beeps. If you don't shut off the alarm button, the alarm will go on forever [ assuming an atomic powered clock :) ]. This same principle is taking place here. The other two paragraps following the one I just explain basically describe how to shut-off the alarm clock
>>window.onload=function(){
timer[0]=setInterval("alterText();", 110);
timer[1]=setInterval("alter();", 100);
timer[3]=setInterval("alter();", 100);
}
In HTML you could do something like:
<body onload="beginProcess()">
You can avoid adding that to your HTML markup by doing the following:
function beginProcess()
{
…
hielo 65 Veteran Poster
>>However, you make various assumptions that I don't appreciate.
My apologies if I offended you. I was just trying be be as thorough as possible just for the sake of clarity. It was not my intention to sound condescending.
>>To my knowledge, also, var++ employs the current value of var, and then increments it before moving on.
This is exactly right. However on your original code you need to reset the "letter" variable after it reaches 23. That's why on my last post, I removed the letter++ from within the parenthesis and then added the following:
letter = ++letter%24;
hielo 65 Veteran Poster
Since you asked, you are probably interested (as oppoed to just curious) about the subject. Here are some resources on the subject [You don't have to read them all at once :) ]
http://www.oreillynet.com/pub/a/network/2000/04/14/doctype/index.html
http://www.456bereastreet.com/archive/200609/no_more_transitional_doctypes_please/
http://www.quirksmode.org/css/quirksmode.html
http://developer.mozilla.org/en/docs/Gecko%27s_%22Almost_Standards%22_Mode
http://www.zvon.org/xxl/xhtmlReference/Output/comparison.html
http://www.blackwidows.co.uk/resources/tutorials/xhtml/attribute-comparison.php
http://www.456bereastreet.com/archive/200606/why_is_the_style_attribute_allowed_in_strict_doctypes/
hielo 65 Veteran Poster
BTW: I did try your code with two local files and it worked for me on both. That's why I am convince the issue is your invalid markup. Make sure your markup is correct on all pages, not just the one containing the iframe.
hielo 65 Veteran Poster
Most likely FF is just not forgiving you for your careless Markup. For example:
<a href="pages/home.html" target="the_iframe">Home</a >
<a href="pages/team.html"aboutus.html" target="the_iframe">The Team</a>
<a href="pages/Projects.html"projects.html" target="the_iframe">Projects</a>
<a href="pages/services.html" target="the_iframe">Services</a>
<a href="pages/Contact.html" target="the_iframe">Contact Us</a>Pay close attention to the href value on "The Team" and "Projects". You have two web addresses back to back AND incorrectly enclosed.
My recommendation: You need to start getting into the habit if using:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
and validate your markup on w3c's validator. If you are doing things right, it should report no errors on your markup. Basically, if no errors are reported there is very little chance that you will "confuse" any standards compliant browser.
hielo 65 Veteran Poster
Here is your updated ORIGINAL code, if you are interested in the infinite color-changing effect:
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="listenlight poetry journal" />
<meta name="keywords" content="poetry" />
<title>listenlight poetry journal</title>
<style type="text/css">
body {
background-image: url('/13/default.png');
background-repeat: repeat; font-size: x-large;
font-weight: bold;font-family: Tahoma, Geneva, Sans-Serif;
letter-spacing: 3px;
line-height: 1.2;
}
#banner {
position: absolute; bottom: 55%; left: 1%; right: 1%;
text-align: center;
font-family: Tahoma, Geneva, Sans-Serif;
letter-spacing: 10px;
}
a.firefox:link {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:visited {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:active {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:hover {color: darkblue; background-color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.archives:link {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:visited {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:active {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:hover {
color: black; text-decoration: none; outline: none; opacity: 0.3; font-variant: small-caps;
font-size: 70%; letter-spacing: 15px; background-color: pink; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
</style>
<script type="text/javascript">
colors = new Array(14)
colors[0]="0"
colors[1]="1"
colors[2]="2"
colors[3]="3"
colors[4]="4"
colors[5]="5"
colors[5]="6"
colors[6]="7"
colors[7]="8"
colors[8]="9"
colors[9]="a"
colors[10]="b"
colors[11]="c"
colors[12]="d"
colors[13]="e"
colors[14]="f"
function genTextHex(){
colorStart="#"
for (j = 0; j == 0; j++){
color = colors[6 + Math.floor(Math.random() * … hielo 65 Veteran Poster
/*
colors is just a list of the possible hexadecimal representation of the color values.
Basically all you have here is a look-up table.
*/
colors = new Array(14)
colors[0]="0"
colors[1]="1"
colors[2]="2"
colors[3]="3"
colors[4]="4"
colors[5]="5"
colors[5]="6"
colors[6]="7"
colors[7]="8"
colors[8]="9"
colors[9]="a"
colors[10]="b"
colors[11]="c"
colors[12]="d"
colors[13]="e"
colors[14]="f"
/*
after this comment, you just encountered your first function definition. It has not been called
yet, but when it does:
this function will generate a random color code. Any single "digit" will be at least 6 and
at most d.
For example:
#7689da;
The only error here is that trailing semicolon. Why? because later on you are assigning
that color to a particular letter, but when you assign these css values via javascript,
they may not contain the ending semicolon. The semicolon is required only in css stylesheets
or <style type="text/css">...</style> blocks to delimit one property from the other. Since in
javascript you can only set/specify one property at a time, there is no need for the trailing
semicolon. As a result, you will get runtime errors because it is an unexpected character on the
property value.
*/
function genTextHex(){
colorStart="#"
for (j = 0; j == 0; j++){
color = colors[6 + Math.floor(Math.random() * 7)]
+ colors[6 + Math.floor(Math.random() * 7)]
+ colors[6 + Math.floor(Math.random() * 7)]
+ ";";
}
return colorStart + color;
}
/*
after this comment, you encounter your second function definition. It has not been called yet
either, but when it does:
Like the previous function this also … hielo 65 Veteran Poster
It's possible that browser is unable to "import" all/any/some of the javascript files. If I were you I would:
a. install Firefox
b. install Webdeveloper Toolbar extension/add-on
c. install Firebug extension
d. Restart Firefox
e. Open the page in question
f. On the Webdeveloper Toolbar click on Information > View Javascript
Make sure you see all the expected javascript files. You will be able to tell very clearly if any of them is missing.
g. IF all the files are there, on the lower right-hand side of the screen you will see a little firebug. Click on it and report here what error details it gives you.
hielo 65 Veteran Poster
No, it does not really work on FF either. There are tons of errors getting triggered and never stopping. These are all because you are not clearing the timeouts you are setting. Since the phrase contains 23 letters, you are not supposed to stop calling the timeout functions after letter 23. These should work across browsers.
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="listenlight poetry journal" />
<meta name="keywords" content="poetry" />
<title>listenlight poetry journal</title>
<style type="text/css">
body {
background-image: url('/13/default.png');
background-repeat: repeat; font-size: x-large;
font-weight: bold;font-family: Tahoma, Geneva, Sans-Serif;
letter-spacing: 3px;
line-height: 1.2;
}
#banner {
position: absolute; bottom: 55%; left: 1%; right: 1%;
text-align: center;
font-family: Tahoma, Geneva, Sans-Serif;
letter-spacing: 10px;
}
a.firefox:link {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:visited {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:active {color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.firefox:hover {color: darkblue; background-color: skyblue; text-decoration: none; outline: none; cursor: default;}
a.archives:link {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:visited {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:active {
color: pink; text-decoration: none; outline: none; opacity: 0.3;
font-size: 80%; font-weight: bold; font-family: Tahoma, Geneva, sans-serif;
}
a.archives:hover {
color: black; text-decoration: none; outline: none; opacity: 0.3; font-variant: small-caps;
font-size: 70%; letter-spacing: 15px; background-color: pink; font-weight: bold; font-family: Tahoma, Geneva, sans-serif; … hielo 65 Veteran Poster
Here's another possibility. I think it is self explanatory.
<?xml version="1.0" encoding="UTF-8"?>
<!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></title>
<script type="text/javascript"><!--
function popup(pg){
window.open(pg,"thumbnail");
}
//cache some of the images
var picture=[];
//picture 1
picture[ picture.length] = new Image(100,25);
picture[ picture.length-1].src="http://tbn0.google.com/images?q=tbn:CEJ6v_RioxskhM:http://www.cs.indiana.edu/hyplan/kinzler/pubs/pvfigs/31.gif";
//picture 2
picture[ picture.length] = new Image(100,25);
picture[ picture.length-1].src="http://tbn0.google.com/images?q=tbn:YgyENENqo-IHsM:http://www.boutell.com/baklava/sconeApplet/start.gif";
//--></script>
</head>
<body>
<!-- load the first two images cached and call the popup after the second image finishes loading -->
<img src="http://tbn0.google.com/images?q=tbn:CEJ6v_RioxskhM:http://www.cs.indiana.edu/hyplan/kinzler/pubs/pvfigs/31.gif" alt="http://tbn0.google.com/images?q=tbn:CEJ6v_RioxskhM:http://www.cs.indiana.edu/hyplan/kinzler/pubs/pvfigs/31.gif">
<img src="http://tbn0.google.com/images?q=tbn:YgyENENqo-IHsM:http://www.boutell.com/baklava/sconeApplet/start.gif" onload="popup(this.src)" alt="http://tbn0.google.com/images?q=tbn:YgyENENqo-IHsM:http://www.boutell.com/baklava/sconeApplet/start.gif">
<script type="text/javascript"><!--
//cache the rest of the images
//picture 3
picture[ picture.length] = new Image(100,25);
picture[ picture.length-1].src="http://tbn0.google.com/images?q=tbn:gPqvrBkrx3DwDM:http://blogoscoped.com/files/google-com-history/thumb/1997.jpg";
//picture N
picture[ picture.length] = new Image(100,25);
picture[ picture.length-1].src="http://tbn0.google.com/images?q=tbn:aZYOvBjNyse0IM:http://my.opera.com/ThePast/homes/files/google%2520com%2520tianmen.png";
//--></script>
<img src="http://tbn0.google.com/images?q=tbn:gPqvrBkrx3DwDM:http://blogoscoped.com/files/google-com-history/thumb/1997.jpg" alt="">
</body>
</html>
hielo 65 Veteran Poster
It sounds like you are using an automatic pop-up that gets triggered AFTER all the thumbnails are loaded. It that is the case, then perhaps you should consider calling the popup after the first or second or third etc., image is loaded instead of waiting for all of them to load. IF you choose to call the popup after image 3 is loaded, you just need to set an onload event handler on that image so that the popup loads. EX:
<img src="image.gif" onload="popup(this.src)"/>
would call your function popup, passing it the value of the src attribute.
hielo 65 Veteran Poster
The real problem here is that you are calling the ajax request asynchronously. That's what the third parameter to req.open means.
true == asynchronous
false = synchronous
What that means is that when the script executes this:
req.send(null);
The javascript interpreter does not wait for the response. It continues executing your script.
Stop and think for a second. If the server takes 2 seconds to reply, but your javascript intepreter goes immediately to the next statement, then nB will not reflect the response from the server. That's why you need it to be synchronously. Basically, you are forcing the interpreter to pause until it gets a response.
The readystatechange and the readyState==4 are perfectly fine. To know if the error file does not exist you need to check for
req.status==404
200 means the files exists, but if it NOT 200, it does not necessarily mean it does not exist. For example
403 means you don't have permission to download the image/file, but it exists.
Also, ideally, your function imagexists() should return a value as shown below:
function imagexists(){
if(req.readyState == 4) {
if(req.status == 200)
{
// image exists
nB=false;
}
else if(req.status==404)
{// image doesn't exist
nB=true;
}
else
{
// all other error codes will set this
nB=null;
}
retur nB;
}
}One last thing, if IE keeps giving you trouble, try
req.send('');
instead of req.send(null);
hielo 65 Veteran Poster
For the sake of debugging, change this:
req.open("head", imagepath, true);
to this:
req.open("HEAD", imagepath, false);
hielo 65 Veteran Poster
I modified the code above slightly and works bor both, IE and FF. If the problem persists, it could be a browser version issue (as opposed to the browser family). Notice that instead of using document.getElementById, I am passing a reference to the object directly. This way you can reuse your function for just about any iframe, regardless of what id you assign to it.
Lastly, the default height and id will be used in case of an error. Typical scenario would be if the page that loads on the iframe is not from your domain. The try-catch is for the page to load up "silently".
<?xml version="1.0" encoding="UTF-8"?>
<!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>iframe Height</title>
<style type="text/css"><!--
#testFrame{border:0;}
--></style>
</head>
<body>
<script type="text/javascript"><!--
function calcHeight(elem)
{
//find the height of the internal page
var the_height=500;
var padding=30;//to avoid the scroll bar
try
{
if( elem.contentWindow && elem.contentWindow.document)
{
the_height=elem.contentWindow.document.body.scrollHeight;
}
}
catch(e){}
//change the height of the iframe
elem.height=the_height +padding;
}
//--></script>
<iframe id="testFrame" onload="calcHeight(this)" src="test1.html"></iframe>
</body>
</html>