HTML Programming
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed Forums > Web Design > HTML Programming
Reload this Page

scrolling layers

Discuss scrolling layers in the HTML Programming forum on Dev Shed.
scrolling layers HTML Programming forum covering discussions of HTML and XHTML, as well as HTML-related issues such as writing W3C Compliant code. Use HyperText Markup Language for building websites.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old October 17th, 2000, 05:28 AM
timbo timbo is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Apr 1999
Location: London
Posts: 110 timbo User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 22 m 26 sec
Reputation Power: 0
Hi all
if anyone could point out where I'm going wrong here I would be most grateful.
basically when the layer repositions itself, the clip area disappears (only in netscape, ie is fine).
I've been looking for two days and its starting to make me go a bit mad

code below
+++++++++++++++++++++++++++++++++++++++++++

<HTML>
<HEAD>


<?

function lhmenu_block($image,$url,$text)
{
return "
<tr>
<td><img src="images/trans.gif" width=5 height=71 border=0 alt=""></td>
<td height="71" width="106" bgcolor="#ffffff" align="center" valign="middle">
<table border="0" cellpadding="0" cellspacing="1">
<tr>
<td><a href="$url"><img src="images/content/Sidebar/$image" width=104 height=69 border=0 alt=""></a></td>
</tr>
</table>
</td>
<td><img src="images/trans.gif" width=5 height=71 border=0 alt=""></td>
</tr>

<tr>
<td colspan="3" bgcolor="#00004c" height="27" align="center" valign="middle"><i>
<font color="#FFC600" size="1" face="arial">$text</font></i></td>
</tr>
";
}

function all_menu_block($offset)
{
echo "<table cellpadding=0 cellspacing=0><tr>";

for ($imgno=0+$offset; $imgno<5+$offset; $imgno++)
{
echo "<td><table cellpadding=0 cellspacing=0>n";
echo lhmenu_block(getimgurl($imgno),geturl($imgno),getdesc($imgno));
echo "n</table></td>n";
}

echo "<td><table cellpadding=0 cellspacing=0>n";
echo lhmenu_block(getimgurl($offset+0),geturl($offset+0),getdesc($offset+0));
echo "n</table></td>n";

echo "</tr></table>";
}

function getimgurl($no)
{
if ($no>4)
$no -= 5;

return "thepeople.gif";
}

function geturl($no)
{
if ($no>4)
$no -= 5;

return "http://www.somewhere.com/";
}

function getdesc($no)
{
if ($no>4)
$no -= 5;

return "foo $no";
}

?>

<div id="warthog0" style="position:absolute; visibility: hidden; left:58px; top:238px; clip:rect(0px 112px 120px 0px); background-color:white; z-index:99; border: 1px solid white;">
<? all_menu_block(0) ?>
</div>

<div id="warthog1" style="position:absolute; visibility: hidden; left:58px; top:338px; clip:rect(0px 112px 120px 0px); background-color:white; z-index:98; border: 1px solid white;">
<? all_menu_block(1) ?>
</div>

<div id="warthog2" style="position:absolute; visibility: hidden; left:58px; top:438px; clip:rect(0px 112px 120px 0px); background-color:white; z-index:97; border: 1px solid white;">
<? all_menu_block(2) ?>
</div>

<script language="JavaScript" src="js/dynlayer.js"></script>
<script language="JavaScript">
<!--

<? # some constants ?>

delay=10;
delaybetween = 1500;

<? # hack for netscape as it renders the cells wider. Look don't ask okay! ?>

dist=4;
w = 116;
if (document.layers)
{
w = 126;
dist=6;
}

<? # this function is called every time the
# layer is slid left. All it does it at
# the same time slide the clipping area on
# that image right
?>

function adjustclip()
{
dyn.clipBy(0,dist,0,dist);
}

<? # After each slide has ended we must
# check if we've reached the end image (which is
# identical to the first) and quickly swap
# to the first again if this is true
?>

function checkFlip()
{
<? # do we need to 'flip' ?>

if (dyn.clipValues('l')>=w*5)
{
dyn.moveBy(w*5,0);
dyn.clipBy(0,-w*5,0,-w*5);

<? # dyn.clipTo(0,112,0,120); ?>
}

<? # move onto the next layer ?>

dync++;
if (dync>maxdyn)
dync=0;
dyn = dyns[dync];

<? # reset the timer to go again ?>

setTimeout(slide,delaybetween);
}

<? # slide the menu across one square ?>

function slide()
{
dyn.slideInit();
dyn.onSlide = adjustclip;
dyn.onSlideEnd = checkFlip;
dyn.slideBy(-w,0,dist,delay);
}

<? # setup the slide
# okay?
?>

function slidesetup()
{
dyns = new Object();
dyns[0] = new DynLayer("warthog0");
dyns[1] = new DynLayer("warthog1");
dyns[2] = new DynLayer("warthog2");

dyns[0].show();
dyns[1].show();
dyns[2].show();

dync = 0;
maxdyn=2;
dyn = dyns[dync];

setTimeout(slide,delaybetween);

}

<? # wait for a short whie for the layers
# to be formed before setting everything off
?>

setTimeout(slidesetup,1000);

// -->
</script>

<body bgcolor="#ffccff">


+++++++++++++++++++++++++++++

tia

tim

[This message has been edited by timbo (edited October 17, 2000).]
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > HTML Programming > scrolling layers

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 2 hosted by Hostway.