Loading...

prototype-scriptaculous@googlegroups.com

[Prev] Thread [Next]  |  [Prev] Date [Next]

[Proto-Scripty] Scriptaculous. Effect.Grow problems Phil Wed Feb 02 03:00:48 2011

I'm having an issue with Effect.Grow
The motion is jerky in both Safari and Firefox (I haven't tried on
other browsers yet).  It seems to grow from somewhere below on the
page, in a different location, THEN take the local div style and
correct itself.  The Effect.Squish is working fine.

I can edit where the div's final location is, but not where it starts
to grow from...  Thoughts?



Link to page:
http://www.brotherskong.com/erinb/portfolio.php



Seemingly Pertinent Code (Full Code below):

<div id="bubblepush" style="margin-left: 20px; display: none; top:
221px; position: absolute;">
<div id="indtext1">
<span class="t22">I'm a <span class="t22b">graphic designer,<br /
>illustrator</span> and <span class="t22b">creative resource.</
span><br />
<span class="t22i">Welcome to my site.</span></span><br /><br /><span
class="t18">Photoshop, Indesign and Illustrator are some of my
favorite tools.  I also love my digital camera, illustration, tablet
and good old fashioned art supplies.</span><br /><br /><span
class="ti">Please browse through my portfolio and contact me with any
requests!</span>
</div>

<div id="indspace">
<img src="images/bigspacer.png" width="87" height="202" border="0"
alt="bigspacer" />
</div>

<div id="indtext2">
<span class="t18i">branding<br />editorial<br />marketing<br /
>collateral<br />custom<br /
>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;illustration<br />retouching<br /
>templates</span>
</div>
</div>


<div id="bottom">
<span class="nav"><a href="#" onClick="Effect.Grow('bubblepush',
{direction: 'bottom-left'}); return false;"
onMouseOut="Effect.Shrink('bubblepush', {direction: 'bottom-left'});
return false;" class="this">about me</a>&nbsp;&nbsp;/
&nbsp;&nbsp;contact: <a href="mailto:[EMAIL PROTECTED]"
class="this">[EMAIL PROTECTED]</a>&nbsp;&nbsp;/
&nbsp;&nbsp;copyright &#169; 2010 erinbdewalt<br />
<span class="copy">Site integration by </span></span><a href="http://
www.brotherskong.com/" target="_new" class="bkd">bKd</a>



Full Code:

<!DOCTYPE html>
<html>
<head>
<title>Erin B Dewalt</title>
<link href="css/ebd.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="http://
fonts.googleapis.com/css?family=Old+Standard+TT" />
<link href="css/lightbox.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?
load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script type="text/javascript" src="js/bubble.js"></script>

</head>

<body>

<div id="encase">
<div id="headnav">
<span class="nav"><a href="index.php" class="that">home</a>&nbsp;/
&nbsp;<a href="portfolio.php" class="this">portfolio</a>&nbsp;/
&nbsp;<a href="contact.php" class="that">contact</a>&nbsp;/&nbsp;<a
href="blog.php" class="that">blog</a></span>
</div>

<div id="centbox">
<div id="logo">
<a href="index.php"><img src="images/ebdlogo.png" width="458"
height="120" border="0" alt="ebdlogo" /></a>
</div>

<div id="foliolinks">
<span class="folio"><a href="portfolio.php" class="this">graphic
design</a>&nbsp;/&nbsp;<a href="illustration.php"
class="that">illustration</a></span>
</div>

<div id="portfolio">
<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a><br />

<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a><br />

<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb1.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
<a href="images/pholdb2.png" rel="lightbox[test]"
title="Placeholder"><img src="images/phold.png" width="108"
height="99" alt="phold" /></a>
</div>

<div id="bubblepush" style="margin-left: 20px; display: none; top:
221px; position: absolute;">
<div id="indtext1">
<span class="t22">I'm a <span class="t22b">graphic designer,<br /
>illustrator</span> and <span class="t22b">creative resource.</
span><br />
<span class="t22i">Welcome to my site.</span></span><br /><br /><span
class="t18">Photoshop, Indesign and Illustrator are some of my
favorite tools.  I also love my digital camera, illustration, tablet
and good old fashioned art supplies.</span><br /><br /><span
class="ti">Please browse through my portfolio and contact me with any
requests!</span>
</div>

<div id="indspace">
<img src="images/bigspacer.png" width="87" height="202" border="0"
alt="bigspacer" />
</div>

<div id="indtext2">
<span class="t18i">branding<br />editorial<br />marketing<br /
>collateral<br />custom<br /
>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;illustration<br />retouching<br /
>templates</span>
</div>
</div>


<div id="bottom">
<span class="nav"><a href="#" onClick="Effect.Grow('bubblepush',
{direction: 'bottom-left'}); return false;"
onMouseOut="Effect.Shrink('bubblepush', {direction: 'bottom-left'});
return false;" class="this">about me</a>&nbsp;&nbsp;/
&nbsp;&nbsp;contact: <a href="mailto:[EMAIL PROTECTED]"
class="this">[EMAIL PROTECTED]</a>&nbsp;&nbsp;/
&nbsp;&nbsp;copyright &#169; 2010 erinbdewalt<br />
<span class="copy">Site integration by </span></span><a href="http://
www.brotherskong.com/" target="_new" class="bkd">bKd</a>

</div>

</div>
</div>
</body>
</html>

-- 
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to [EMAIL PROTECTED]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.