trying to write a disjointed rollover... Stuck...

4 posts by 3 authors in: Forums > CMS Builder
Last Post: December 9, 2008   (RSS)

Re: [HDLLC] trying to write a disjointed rollover... Stuck...

By Dave - September 5, 2008

Hi Jeff,

Do you have an url with the output generated by CMS Builder?

You may need to preload the images like this: MM_preloadImages('red.gif','blue.gif') but with the actual image names.

Can you post an url with the generated content (the CMS version)? Then I can compare the sources of the working mockup and the CMS generated one.

Thanks!
Dave Edis - Senior Developer
interactivetools.com

Re: [HDLLC] trying to write a disjointed rollover... Stuck...

By Stensy - December 9, 2008 - edited: December 9, 2008

Hi HDLLC

I was working on something similar a few weeks ago. I hope this helps.

Add this to your page header, make sure to set the pathway correctly. It links to the attached JS file.
<script type="text/javascript" src="js/navigation.js"></script>


Here is your CMSB image loop, I added the javascript in red to the loop. The part in green is the name of the main image or main div where you want the image to load, so just create a placeholder image or div with a static size. In my case I used another image which then changed to the image that the user rolled over. (below)

Rollover Image Loop

<?php foreach ($yourRecord['images'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<a href="javascript:;" onmouseout="MM_swapImgRestore();" onMouseOver="MM_swapImage('mainimage_r3_c6'[/#80ff00],'','<?php echo $upload['urlPath'] ?>',1)"> [/#ff0000]<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" /></a>
<?php endif ?>
<?php endforeach ?>[/#000000]

My placeholding image!
Please note the name of the image placeholder below it must be the same as the green mainimage_r3_c6 above, this can be changed however to what ever you like.

<?php foreach ($yourRecord['image'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<img name="mainimage_r3_c6[/#00ff00]" src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php endif ?>



Hope this helps a little it may not be what you asked for though.
Attachments:

navigation.js 2K

Re: [Stensy] trying to write a disjointed rollover... Stuck...

By Dave - December 9, 2008

Thanks for sharing your code. :)
Dave Edis - Senior Developer
interactivetools.com