/    Sign up×
Community /Pin to ProfileBookmark

Help me phpnovice…youre my only hope

Copy linkTweet thisAlerts:
Jul 06.2006

Hi again, well I tried, I really did. I spent about 5 hours trying to debug this. I thought it was just an extension of the tips you sent me yesterday. Can you spot anything obviously wrong? I guess you will spot my problem immediately and confirm I am a moron. I am using trellian Webpage as my editor. Cheers again, James

<HTML>
<HEAD>
<SCRIPT LANGUAGE=”JavaScript”>
<!– Begin
// Preload Images

var imagef1 = new Image(); imagef1.src = “http://hardyart.co.uk/frame/frame1.jpg“;
var imagef2 = new Image(); imagef2.src = “http://hardyart.co.uk/frame/frame2.jpg“;
var imagef3 = new Image(); imagef3.src = “http://hardyart.co.uk/frame/frame3.jpg“;
var imagef4 = new Image(); imagef4.src = “http://hardyart.co.uk/frame/frame4.jpg“;

var image1tl = new Image(); image1tl.src = “http://hardyart.co.uk/frame/tl.jpg“;
var image2tl = new Image(); image2tl.src = “http://hardyart.co.uk/frame/2-tl.jpg“;
var image3tl = new Image(); image3tl.src = “http://hardyart.co.uk/frame/3-tl.jpg“;
var image4tl = new Image(); image4tl.src = “http://hardyart.co.uk/frame/4-tl.jpg“;

var image1tr = new Image(); image1tr.src = “http://hardyart.co.uk/frame/tr.jpg“;
var image2tr = new Image(); image2tr.src = “http://hardyart.co.uk/frame/2-tr.jpg“;
var image3tr = new Image(); image3tr.src = “http://hardyart.co.uk/frame/3-tr.jpg“;
var image4tr = new Image(); image4tr.src = “http://hardyart.co.uk/frame/4-tr.jpg“;

var image1bl = new Image(); image1bl.src = “http://hardyart.co.uk/frame/bl.jpg“;
var image2bl = new Image(); image2bl.src = “http://hardyart.co.uk/frame/2-bl.jpg“;
var image3bl = new Image(); image3bl.src = “http://hardyart.co.uk/frame/3-bl.jpg“;
var image4bl = new Image(); image4bl.src = “http://hardyart.co.uk/frame/4-bl.jpg“;

var image1br = new Image(); image1br.src = “http://hardyart.co.uk/frame/br.jpg“;
var image2br = new Image(); image2br.src = “http://hardyart.co.uk/frame/2-br.jpg“;
var image3br = new Image(); image3br.src = “http://hardyart.co.uk/frame/3-br.jpg“;
var image4br = new Image(); image4br.src = “http://hardyart.co.uk/frame/4-br.jpg“;

var image1h = new Image(); image1h.src = “http://hardyart.co.uk/frame/1-h.jpg“;
var image2h = new Image(); image2h.src = “http://hardyart.co.uk/frame/2-h.jpg“;
var image3h = new Image(); image3h.src = “http://hardyart.co.uk/frame/3-h.jpg“;
var image4h = new Image(); image4h.src = “http://hardyart.co.uk/frame/4-h.jpg“;

var image1v = new Image(); image1v.src = “http://hardyart.co.uk/frame/1-v.jpg“;
var image2v = new Image(); image2v.src = “http://hardyart.co.uk/frame/2-v.jpg“;
var image3v = new Image(); image3v.src = “http://hardyart.co.uk/frame/3-v.jpg“;
var image4v = new Image(); image4v.src = “http://hardyart.co.uk/frame/4-v.jpg“;

// End –>

</script>

</HEAD>
<BODY>
<P>
<A href=”#”
onmouseover=”
imagef1.src=’http://hardyart.co.uk/frame/frame1.jpg‘;
document.getElementById(‘image1tl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/tl.jpg‘)’;
document.getElementById(‘image1tr’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/tr.jpg‘)’;
document.getElementById(‘image1bl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/bl.jpg‘)’;
document.getElementById(‘image1br’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/br.jpg‘)’;
document.getElementById(‘image1th’).style.backgroundImage =
document.getElementById(‘image1bh’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/1-h.jpg‘)’;
document.getElementById(‘image1lv’).style.backgroundImage =
document.getElementById(‘image1rv’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/1-v.jpg‘)’;>
<IMG name=imagef1 src=”http://hardyart.co.uk/frame/frame1.jpg”></A>
</P>

<P>
<A href=”#”
onmouseover=”
imagef2.src=’http://hardyart.co.uk/frame/frame2.jpg‘;
document.getElementById(‘image2tl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-tl.jpg‘)’;
document.getElementById(‘image2tr’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-tr.jpg‘)’;
document.getElementById(‘image2bl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-bl.jpg‘)’;
document.getElementById(‘image2br’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-br.jpg‘)’;
document.getElementById(‘image2th’).style.backgroundImage =
document.getElementById(‘image2bh’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-h.jpg‘)’;
document.getElementById(‘image2lv’).style.backgroundImage =
document.getElementById(‘image2rv’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/2-v.jpg‘)’;>
<IMG name=imagef2 src=”http://hardyart.co.uk/frame/frame2.jpg”></A>
</P>

<P>
<A href=”#”
onmouseover=”
imagef3.src=’http://hardyart.co.uk/frame/frame3.jpg‘;
document.getElementById(‘image3tl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-tl.jpg‘)’;
document.getElementById(‘image3tr’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-tr.jpg‘)’;
document.getElementById(‘image3bl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-bl.jpg‘)’;
document.getElementById(‘image3br’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-br.jpg‘)’;
document.getElementById(‘image3th’).style.backgroundImage =
document.getElementById(‘image3bh’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-h.jpg‘)’;
document.getElementById(‘image3lv’).style.backgroundImage =
document.getElementById(‘image3rv’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/3-v.jpg‘)’;>
<IMG name=imagef3 src=”http://hardyart.co.uk/frame/frame3.jpg”></A>
</P>

<P>
<A href=”#”
onmouseover=”
imagef4.src=’http://hardyart.co.uk/frame/frame4.jpg‘;
document.getElementById(‘image4tl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-tl.jpg‘)’;
document.getElementById(‘image4tr’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-tr.jpg‘)’;
document.getElementById(‘image4bl’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-bl.jpg‘)’;
document.getElementById(‘image4br’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-br.jpg‘)’;
document.getElementById(‘image4th’).style.backgroundImage =
document.getElementById(‘image4bh’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-h.jpg‘)’;
document.getElementById(‘image4lv’).style.backgroundImage =
document.getElementById(‘image4rv’).style.backgroundImage =
‘url(‘http://hardyart.co.uk/frame/4-v.jpg‘)’;>
<IMG name=imagef4 src=”http://hardyart.co.uk/frame/frame4.jpg”></A>
</P>

<TABLE>
<TBODY>
<TR>
<TD width=100 height=50 id=”image1tl” style=”background-image: url(‘http://hardyart.co.uk/frame/tl.jpg’);”></TD>
</TR>
<TR>
<TD width=100 height=50 id=”image1tr” style=”background-image: url(‘http://hardyart.co.uk/frame/tr.jpg’);”></TD>
</TR>
<TR>
<TD width=100 height=50 id=”image1bl” style=”background-image: url(‘http://hardyart.co.uk/frame/bl.jpg’);”></TD>
</TR>
<TR>
<TD width=100 height=50 id=”image1br” style=”background-image: url(‘http://hardyart.co.uk/frame/br.jpg’);”></TD>
</TR>

<TR>
<TD width=100 height=50 id=”image1th” style=”background-image: url(‘http://hardyart.co.uk/frame/1-h.jpg’);”></TD>
</TR>

<TR>
<TD width=100 height=50 id=”image1bh” style=”background-image: url(‘http://hardyart.co.uk/frame/1-h.jpg’);”></TD>
</TR>

<TR>
<TD width=100 height=50 id=”image1lv” style=”background-image: url(‘http://hardyart.co.uk/frame/1-v.jpg’);”></TD>
</TR>

<TR>
<TD width=100 height=50 id=”image1rv” style=”background-image: url(‘http://hardyart.co.uk/frame/1-v.jpg’);”></TD>
</TR>

</TBODY></TABLE>
</BODY>
</HTML>

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@PineSolPirateJul 06.2006 — I'm still poking around at this, but one thing of note is that your "href" in each tag isn't closed at the end.

Eg.[CODE]...ntById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/1-v.jpg')';>[/CODE] should be [CODE]...ntById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/1-v.jpg')';">[/CODE]
Check the second to last character if you aren't seeing it in the example.
Copy linkTweet thisAlerts:
@PineSolPirateJul 06.2006 — Found the major problem, you were refrencing objects that didn't exist.

Here's the version I got working
[CODE]<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var imagef1 = new Image(); imagef1.src = "http://hardyart.co.uk/frame/frame1.jpg";
var imagef2 = new Image(); imagef2.src = "http://hardyart.co.uk/frame/frame2.jpg";
var imagef3 = new Image(); imagef3.src = "http://hardyart.co.uk/frame/frame3.jpg";
var imagef4 = new Image(); imagef4.src = "http://hardyart.co.uk/frame/frame4.jpg";

var image1tl = new Image(); image1tl.src = "http://hardyart.co.uk/frame/tl.jpg";
var image2tl = new Image(); image2tl.src = "http://hardyart.co.uk/frame/2-tl.jpg";
var image3tl = new Image(); image3tl.src = "http://hardyart.co.uk/frame/3-tl.jpg";
var image4tl = new Image(); image4tl.src = "http://hardyart.co.uk/frame/4-tl.jpg";

var image1tr = new Image(); image1tr.src = "http://hardyart.co.uk/frame/tr.jpg";
var image2tr = new Image(); image2tr.src = "http://hardyart.co.uk/frame/2-tr.jpg";
var image3tr = new Image(); image3tr.src = "http://hardyart.co.uk/frame/3-tr.jpg";
var image4tr = new Image(); image4tr.src = "http://hardyart.co.uk/frame/4-tr.jpg";

var image1bl = new Image(); image1bl.src = "http://hardyart.co.uk/frame/bl.jpg";
var image2bl = new Image(); image2bl.src = "http://hardyart.co.uk/frame/2-bl.jpg";
var image3bl = new Image(); image3bl.src = "http://hardyart.co.uk/frame/3-bl.jpg";
var image4bl = new Image(); image4bl.src = "http://hardyart.co.uk/frame/4-bl.jpg";

var image1br = new Image(); image1br.src = "http://hardyart.co.uk/frame/br.jpg";
var image2br = new Image(); image2br.src = "http://hardyart.co.uk/frame/2-br.jpg";
var image3br = new Image(); image3br.src = "http://hardyart.co.uk/frame/3-br.jpg";
var image4br = new Image(); image4br.src = "http://hardyart.co.uk/frame/4-br.jpg";

var image1h = new Image(); image1h.src = "http://hardyart.co.uk/frame/1-h.jpg";
var image2h = new Image(); image2h.src = "http://hardyart.co.uk/frame/2-h.jpg";
var image3h = new Image(); image3h.src = "http://hardyart.co.uk/frame/3-h.jpg";
var image4h = new Image(); image4h.src = "http://hardyart.co.uk/frame/4-h.jpg";

var image1v = new Image(); image1v.src = "http://hardyart.co.uk/frame/1-v.jpg";
var image2v = new Image(); image2v.src = "http://hardyart.co.uk/frame/2-v.jpg";
var image3v = new Image(); image3v.src = "http://hardyart.co.uk/frame/3-v.jpg";
var image4v = new Image(); image4v.src = "http://hardyart.co.uk/frame/4-v.jpg";
</script>

</HEAD>
<BODY>
<P>
<A href="#"
onmouseover="
imagef1.src='http://hardyart.co.uk/frame/frame1.jpg';
document.getElementById('image1tl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/tl.jpg')';
document.getElementById('image1tr').style.backgroundImage =
'url('http://hardyart.co.uk/frame/tr.jpg')';
document.getElementById('image1bl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/bl.jpg')';
document.getElementById('image1br').style.backgroundImage =
'url('http://hardyart.co.uk/frame/br.jpg')';
document.getElementById('image1th').style.backgroundImage =
document.getElementById('image1bh').style.backgroundImage =
'url('http://hardyart.co.uk/frame/1-h.jpg')';
document.getElementById('image1lv').style.backgroundImage =
document.getElementById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/1-v.jpg')';">
<IMG name=imagef1 src="http://hardyart.co.uk/frame/frame1.jpg"></A>
</P>

<P>
<A href="#"
onmouseover="
imagef2.src='http://hardyart.co.uk/frame/frame2.jpg';
document.getElementById('image1tl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-tl.jpg')';
document.getElementById('image1tr').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-tr.jpg')';
document.getElementById('image1bl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-bl.jpg')';
document.getElementById('image1br').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-br.jpg')';
document.getElementById('image1th').style.backgroundImage =
document.getElementById('image1bh').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-h.jpg')';
document.getElementById('image1lv').style.backgroundImage =
document.getElementById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/2-v.jpg')';">
<IMG name=imagef2 src="http://hardyart.co.uk/frame/frame2.jpg"></A>
</P>


<P>
<A href="#"
onmouseover="
imagef3.src='http://hardyart.co.uk/frame/frame3.jpg';
document.getElementById('image1tl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-tl.jpg')';
document.getElementById('image1tr').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-tr.jpg')';
document.getElementById('image1bl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-bl.jpg')';
document.getElementById('image1br').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-br.jpg')';
document.getElementById('image1th').style.backgroundImage =
document.getElementById('image1bh').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-h.jpg')';
document.getElementById('image1lv').style.backgroundImage =
document.getElementById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/3-v.jpg')';">
<IMG name=imagef3 src="http://hardyart.co.uk/frame/frame3.jpg"></A>
</P>


<P>
<A href="#"
onmouseover="
imagef4.src='http://hardyart.co.uk/frame/frame4.jpg';
document.getElementById('image1tl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-tl.jpg')';
document.getElementById('image1tr').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-tr.jpg')';
document.getElementById('image1bl').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-bl.jpg')';
document.getElementById('image1br').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-br.jpg')';
document.getElementById('image1th').style.backgroundImage =
document.getElementById('image1bh').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-h.jpg')';
document.getElementById('image1lv').style.backgroundImage =
document.getElementById('image1rv').style.backgroundImage =
'url('http://hardyart.co.uk/frame/4-v.jpg')';">
<IMG name=imagef4 src="http://hardyart.co.uk/frame/frame4.jpg"></A>
</P>


<TABLE>
<TBODY>
<TR>
<TD width=100 height=50 id="image1tl" style="background-image: url('http://hardyart.co.uk/frame/tl.jpg');"></TD>
</TR>
<TR>
<TD width=100 height=50 id="image1tr" style="background-image: url('http://hardyart.co.uk/frame/tr.jpg');"></TD>
</TR>
<TR>
<TD width=100 height=50 id="image1bl" style="background-image: url('http://hardyart.co.uk/frame/bl.jpg');"></TD>
</TR>
<TR>
<TD width=100 height=50 id="image1br" style="background-image: url('http://hardyart.co.uk/frame/br.jpg');"></TD>
</TR>

<TR>
<TD width=100 height=50 id="image1th" style="background-image: url('http://hardyart.co.uk/frame/1-h.jpg');"></TD>
</TR>

<TR>
<TD width=100 height=50 id="image1bh" style="background-image: url('http://hardyart.co.uk/frame/1-h.jpg');"></TD>
</TR>

<TR>
<TD width=100 height=50 id="image1lv" style="background-image: url('http://hardyart.co.uk/frame/1-v.jpg');"></TD>
</TR>

<TR>
<TD width=100 height=50 id="image1rv" style="background-image: url('http://hardyart.co.uk/frame/1-v.jpg');"></TD>
</TR>

</TBODY></TABLE>
</BODY>
</HTML>[/CODE]
Notice in each mousever (except the first) I changed the "...document.getElementById('image1th)..." all back to 1's, they were 2's, 3's, and 4's
Copy linkTweet thisAlerts:
@dance621authorJul 07.2006 — Thanks PineSolPirate. Such small differences make or break the code. I would have been staring at that for hours. Many thanks. James
Copy linkTweet thisAlerts:
@PineSolPirateJul 07.2006 — No problem. If you use firefox there is an extension called [URL]https://addons.mozilla.org/firefox/60/[/URL]Web Developer Toolbar[/URL] that has a ton of great tools, including a handy built in javascript console. If you add it look to the far right of the toolbar and click on the little icon. Very handy as it gives line numbers and stuff. ?
×

Success!

Help @dance621 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...