This is Interesting: Free Magazines for Graphics designers and webmasters
Home > Archive > FrontPage Programming > March 2007 > Scrolling information in top frame on page.
You are viewing an archived Text-only version of the thread.
To view this thread in it's original format and/or if you want to reply to
this thread please [click here]
| Author |
Scrolling information in top frame on page.
|
|
| rayandrhon 2007-03-29, 7:16 pm |
| I am new to FrontPage. I would like to be able to place business cards in the
top frame and have them scroll from right to left, like a marquee. Help?!
| |
| Kevin Spencer 2007-03-29, 7:16 pm |
| Business Cards? You mean those rectangular squares of paper that people
carry in their wallets?
--
HTH,
Kevin Spencer
Microsoft MVP
Printing Components, Email Components,
Networking Components, Controls, much more.
DSI PrintManager, Miradyne Component Libraries:
http://www.miradyne.net
"rayandrhon" <rayandrhon@discussions.microsoft.com> wrote in message
news:8AA618E5-D79F-48BB-9E3F-D51E49E6F09F@microsoft.com...
>I am new to FrontPage. I would like to be able to place business cards in
>the
> top frame and have them scroll from right to left, like a marquee. Help?!
| |
| rayandrhon 2007-03-29, 7:16 pm |
| That would be correct. I want to scan in the cards of sponsors and have them
on the website.........
"Kevin Spencer" wrote:
> Business Cards? You mean those rectangular squares of paper that people
> carry in their wallets?
>
> --
> HTH,
>
> Kevin Spencer
> Microsoft MVP
>
> Printing Components, Email Components,
> Networking Components, Controls, much more.
> DSI PrintManager, Miradyne Component Libraries:
> http://www.miradyne.net
>
> "rayandrhon" <rayandrhon@discussions.microsoft.com> wrote in message
> news:8AA618E5-D79F-48BB-9E3F-D51E49E6F09F@microsoft.com...
>
>
>
| |
| Beemer Biker 2007-03-29, 7:16 pm |
| "rayandrhon" <rayandrhon@discussions.microsoft.com> wrote in message
news:8AA618E5-D79F-48BB-9E3F-D51E49E6F09F@microsoft.com...
>I am new to FrontPage. I would like to be able to place business cards in
>the
> top frame and have them scroll from right to left, like a marquee. Help?!
Quick and dirty way is to make a single animated gif of all cards with the
appropriate time delay in between. Some security settings (sp2 etc) may
prevent them from running. I personally cannot stand any type of banner or
marquee and would avoid any site that that something like that (excluding
britney or j-lo animations)
--
======================================================================
Joseph "Beemer Biker" Stateson
http://ResearchRiders.org Ask about my 99'R1100RT
======================================================================
| |
| Kevin Spencer 2007-03-30, 7:16 pm |
| Actually, it would NOT be correct. After you scan them, they are not
business cards. They are images.
So, what you REALLY want to do is to display images scrolling across the top
of the screen. The following is a page I created that does this. Here are
the basics:
1. You need to use the style sheet in the head.
2. The div with class "CardMarquee" contains all of the divs and the
scripting to use. It is absolutely positioned, so you can place it anywhere
in a page (top, bottom, middle, etc.)
3. The number of images is not related to the number of divs. Each div gets
a new image from the list when it disappears off the left side.
4. The width of the area that the divs scroll across is 1280 pixels. Each
div is 252 pixels in width.
5. The space between the divs is calculated based on the number of divs and
the width of each div, so that they will wrap around like a marquee.
6. The variable "started" can be used to stop the scrolling, by setting it
to false.
7. The variable "ct" represents the index in the array of images of the next
image to display. It is the index of the first image that is not in a div
already.
8. The "interval" variable is the interval in milliseconds between calls to
move the divs. You can use this to speed it up or slow it down.
--
HTH,
Kevin Spencer
Microsoft MVP
Printing Components, Email Components,
Networking Components, Controls, much more.
DSI PrintManager, Miradyne Component Libraries:
http://www.miradyne.net
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
..CardDiv
{
width: 252px;
height: 148px;
background-color: #000066;
position: absolute;
top: 0px;
left: 1280px;
}
#CardMarquee
{
background-color: #CCFFFF;
border: 1px solid #66CCFF;
width: 100%;
height: 148px;
position: absolute;
top: 50px;
}
body
{
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="CardMarquee">
<div class="CardDiv" id="card1"><img src="images/buscard1.jpg"
id="img0"/></div>
<div class="CardDiv" id="card2"><img src="images/buscard2.jpg"
id="img1"/></div>
<div class="CardDiv" id="card3"><img src="images/buscard3.jpg"
id="img2"/></div>
<div class="CardDiv" id="card4"><img src="images/buscard4.jpg"
id="img3"/></div>
<script type="text/javascript"><!--
var aryUrls = new Array();
aryUrls[0] = "images/buscard1.jpg";
aryUrls[1] = "images/buscard2.jpg";
aryUrls[2] = "images/buscard3.jpg";
aryUrls[3] = "images/buscard4.jpg";
aryUrls[4] = "images/buscard5.jpg";
var divs = new Array();
divs[0] = document.getElementById("card1");
divs[1] = document.getElementById("card2");
divs[2] = document.getElementById("card3");
divs[3] = document.getElementById("card4");
var space = 1532 / divs.length;
var start = 1280;
for (i = 0; i < divs.length; i++)
{
divs[i].style.left = start + "px";
start += space;
}
var interval = 50;
var ct = 4;
var started = true;
function moveImages()
{
if (!started) return;
var left;
var url = "img";
for (i = 0; i < divs.length; i++)
{
left = divs[i].offsetLeft - 5;
if (left < -255)
{
left = 1280;
document.getElementById(url + i).src = aryUrls[ct++];
if (ct == aryUrls.length) ct = 0;
}
divs[i].style.left = left + "px";
}
}
setInterval("moveImages()", interval);
// --></script>
</div>
</body>
</html>
"rayandrhon" <rayandrhon@discussions.microsoft.com> wrote in message
news:7E6B75E1-62CB-430D-B9CA-C9B30F25D9D3@microsoft.com...[color=darkred]
> That would be correct. I want to scan in the cards of sponsors and have
> them
> on the website.........
>
> "Kevin Spencer" wrote:
>
|
|
|
| | Copyright 2003 - 2008 forum4designers.com Software forum Computer Hardware reviews |
|