Fixed Background/Scrolling text table

I have a fixed background image (no repeat) I have a table
inserted (760px) that contains my text. My pages are different
lengths. How do I get the table to scroll over the background
image? (www.soulseekers.org.uk) Thanks for your help....

Just be aware that background-attachment:fixed doesn't work
in IE6 and
earlier on anything other than the body tag....
I'm not sure about IE7, but I think it's OK there.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"FreakyJesus" <[email protected]> wrote in
message
news:fmi781$8el$[email protected]..
>I think it looks great. If i had any quibble it would be
it's too good an
>mage
> to waste mostly hidden.
> But now I see, though, that you've made it more visible
by removing the
> black
> bg in the table, and i think it's perfect as-is. If you
do want the image
> to
> appear only behind the table (i think that's what you're
describing) then
> you
> have to cheat a little. There are few methods but i
think the easiest
> might be
> to create a DIV the same width as the table. Give it
left and right
> margins set
> to auto (to centre it on the screen) and then make your
image the
> background to
> this DIV and make it fixed like before.
> Wrap this DIV around your table, and this will give you
the effect. But
> honestly, I think it's better as you have it now with
the image taking up
> the
> wider area. I love it.
>
> Andy
>

Similar Messages

How to key out black background - scrolling text

Hi, I have created scrolling text for credits at the end of my movie. How do I key out the black background to use as an overlay? Am I missing a setting? Thanks.

hmm ... if you save this motion project and import it into final cut pro, it'll be transparent.
maybe i don't understand what you mean.
you don't export a movie from motion, you save the file and the rendering is then handled by FCP.

Can I, as a webmaster use the bgproperties="fixed" html to show a non scrolling, fixed background?

Here is my body tag...
<body onLoad="scrollit(100);" BGPROPERTIES="fixed" background="images/highway-bg.jpg">
I want my background to be fixed. Will this work in the Firefox browser? Is there another way?

Try posting at the Web Development / Standards Evangelism forum at MozillaZine. The helpers over there are more knowledgeable about web page development issues with Firefox. <br />
http://forums.mozillazine.org/viewforum.php?f=25 <br />
You'll need to register and login to be able to post in that forum.

How can I use a table as source for scrolling text

Hi,
I have a javascript scolling news on our portal page and anytime I need to update the news I have to update the portlet. Is there a way to use a database table to store the news and get it displayed automatically (as a scrolling text) after committing the transaction.
Thanks,
Leonard

What do you mean by updating the portlet - page refresh?
The nature of HTTP is that the client has to initiate the communication. As long as the browser doesn't submit a new request for the page, the content won't refresh.
There are tricks, though that you may consider... such as placing an iframe on your portal page that "pings" the server and checks whether there's any change on the server side. Another option could be using an applet.

New bug in IE11 -- scrolling position:fixed + background-image elements jitters badly.

visit the following page in IE10 and IE11, and use your mouse wheel to scroll the page:
http://www.oussamaharb.com/
In IE <= 10, Safari, Chrome, and FireFox, the header section of that page stays put when scrolling. However, only in IE11, when you scroll the page the the header jumps around and jitters. Essentially IE11 will do this on any div with a fixed
background image.
Note the jitter does not happen if you grab the scrollbar with the cursor and move it up and down (which people rarely do). Some sort of bug when using mouse wheel has been introduced in IE11.

You are too late to see. He removed
background-attachment:fixed with IE11. His link originally showed the stuttering. It looked too unsatisfactory.
You can still see his handsome design with FireFox where it continues to work well. (And also good with Chrome, Opera, Safari too). See how the picture on top stays fixed when you scroll the page? Not with IE anymore. With IE
that great effect is removed, sacrificed to cure the ugly wart. The picture now just scrolls upward with the page to avoid the IE11 bug. Too bad.
Since your first reply here 7 months ago. Have you any special MVP insider-info yet how to make this great CSS3 port-hole feature scroll smoothly with IE11? Or possibly, you have encouraging news that it will become corrected in IE12? Your
name is IECustomizer MVP. It sounds like you will know.
Here are more stutter examples for you to examine. You may click the background to toggle several different ways to see the affliction during scroll. Please post back and tell your observation that you can see this stutter.
https://googledrive.com/host/0B8BLd2qPPV7XOGl1Sjk3c29uVlU
Possibly somebody still hasn't yet noticed in bryanangler's example ("OP"), IE11 needs to be maximized (or large) to observe the problem. At least,
somebody has not acknowledged. Bryanangler's page is Responsive Web Design (RWD). The menu on top is present when space permits. That's when the
background-attachment:fixed applies and makes the horrid stutter.

Fixed Background Help

Guys,
Im pretty new to Dreamweaver and am having some problems
designing a website.
I am wanting to have a fixed background and then a square box
with my content in. I dont want the background to move when I
scroll down the page, but I do want the box with my content to
scroll.
Any ideas how I can do this?
Next question... how come when I design a page in
Dreamweaver, when I view it in IE its positioned completely
different? i.e. I centre a picture in Dreamweaver and when I view
it in IE its in the top left hand corner etc its very random
Thanks in advance

> Out of curiosity, when making a web page... what
size/dimensions do you
> set
> your page?
To make your decision you need to have some ideas about the
following
issues -
1. What is the primary target demographic for this site?
2. What are the browsing habits of that demographic? Do they
normally have
their browser window maximized on the screen?
3. If they usually have their browser maximized, what is the
typical screen
width?
4. If they usually do NOT have their browser maximized, what
is the MINIMUM
screen width in that demographic.
5. How do I want to build the page?
a. Fixed width and left aligned?
b. Fixed width and centering?
c. Flexible to fill whatever width from left to right?
d. Flexible (within limits) and left aligned?
e. Flexible (within limits) and centering?
As you can see, this decision is probably much more complex
than you
thought, and will require that you know quite a bit about
your intended
target visitor and their browsing habits.
If you elect to go with 5a, or 5b, then your decision would
be - 'what is
the mimimum browser width I want to support without
horizontal scrolling?'.
Once you have determined that minimum supported width, all of
your decisions
are made. That's how wide you want your page to be.
If you elect to go with 5c, then you just build your page
within a flexible
container (the simplest example - although an obsolet one -
would be to use
a 100% width table to hold the entire page). Be aware that
pages with
limited text content can look VERY sparse and empty on wide
viewports when
built in this way.
If you elect to go with 5d, or 5e, then you would add this
sophistication to
your decision matrix -
'what is the greatest width I want to allow the page and its
contents to
become?'
In this case, you would use the CSS styles - 'min-width' and
'max-width' on
the primary page container. Just so you'll know, although
these styles are
well supported *now*, earlier versions of IE (and some other
browsers) will
not support them so reliably.
So - which is it? 8)
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Martin.Maggiore" <[email protected]> wrote
in message
news:[email protected]...
>I did think that was the case but I was having issues
with the positioning
>when
> I did that.
>
> I think part of the problem is the design of the
background.
>
> Out of curiosity, when making a web page... what
size/dimensions do you
> set
> your page?
>
> I make my websites first in photoshop and then slice
them into Dreamweaver
>

Fix background image within div

Hello
I've done a lot of research about this, and tons os answers have come up, still, none solved my problem so far.
I'm trying to make the background image within a div to be fixed when i scroll vertically.
Have a template made, in which the only editable div is the rightdiv. (in red, to be easier)
Here's my code
CSS
body {
margin-top: 0px;
margin-bottom: 0px;
background-position: center center;
background-image: url(../Images/bgdr.jpg);
background-repeat: no-repeat;
#wrapper {
height: 875px;
width: 1000px;
margin-right: auto;
margin-left: auto;
background-repeat: no-repeat;
#header {
background-repeat: no-repeat;
clear: none;
float: none;
height: 214px;
width: 1000px;
background-image: none;
position: relative;
padding-top: 10px;
#leftDiv {
clear: none;
float: left;
height: 500px;
width: 245px;
position: relative;
text-decoration: none;
#rightDiv {
clear: none;
float: right;
height: 484px;
width: 755px;
position: relative;
overflow: auto;
#footer {
height: 100px;
width: 1000px;
clear: both;
position: relative;
padding-bottom: 20px;
And here is my HTML

<div id="rightDiv" style="background-image: url(Images/informacao.png)">
</div>

Well, thing is that on Internet Explorer 9, the background image will repeat vertically when i scroll vertically. On Chrome it will stay fixed on scroll (and that is what i want).
I tried adding style="background-attachment:fixed" , but that will make the image align fix itself relatively to the whole page, not the div only. Also, it repeats itself 4 times to oocupy the screen. I can solve that by "no-repeat", but it still is fixed to the browser page, not the div.
I've been trying to fix this for days.. Help would be much appreciated.
Funny thing is that this only happens in IE9.. Chrome works perfectly.

DevilUrd wrote:
Didn't work. sorry, but i don't think i understood ur reply quite well..
Here's what i used:

<div id="rightDiv" background: url('Images/informacao.png') no repeat fixed;>
<tr>
<td>textextextextextextextextext</td>
</tr>

Could u pls be a little more detailed?
sorry, but i'm still very unexperienced at this..
That is not a valid way to write css into your page and will not work. You appear to be trying to use the background shorthand css property within the html tag itself. If you want to use an inline style, it would need to be within the style html attribute...
<div id="rightDiv" style="background:url(Images/informacao.png") no-repeat fixed top left;">
But it would be better to place it in your css instead...
#rightDiv {
clear: none;
background:url(Images/informacao.png") no-repeat fixed top left;
float: right;
height: 484px;
width: 755px;
position: relative;
overflow: auto;

Fixed background

Could you please look at my code and tell me what I need to do to get the fixed background to cover the whole page?
Thank you
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style></style>
<link rel="shortcut icon" href="favicon.ico" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Template</title>

<style type="text/css">

</style>
<script type="text/javascript">

</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-20050097-1']);
_gaq.push(['_setDomainName', '.appliedtaiji.com']);
_gaq.push(['_trackPageview']);
(function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
</script>


</head>
<p class="wave"> </p>
<table width="993" align="center">
<tr>
    <td><table width="993" align="center">
      
      <tr>
        <td width="993" align="center" valign="middle"><table width="924" height="215" align="center">
          <tr>
            <td width="916" height="209" align="center" valign="middle"><p><img src="../images/variety/MainBanner2.jpg" alt="banner" width="993" height="133" align="top" longdesc="../images/variety/MainBanner2.jpg" /></p>
              <table width="993" border="0" align="center">
                <tr bgcolor="#1c3764">
                  <td width="840" height="36" align="center" valign="middle"><table width="934" height="32" align="center" cellpadding="0" cellspacing="0">
                    
                    <tr align="center" valign="middle" bordercolor="#000033" class="linkz">
                      <td width="877" height="28"><table width="915" border="0" align="center" cellpadding="0" cellspacing="0" bordercolor="#000033">
                        <tr align="center" valign="middle" bgcolor="#2c2b6d" class="home1">
                          <td width="85" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center">
                            <div align="center" class="home"><a href="../index.html" class="linkz">Home</a></div>
                          </div></td>
                          <td width="89" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center" class="home1"><a href="../classes.html" class="home1">Classes</a></div></td>
                          <td width="98" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center"><a href="../instructors.html" class="home1">Instructors</a></div></td>
                          <td width="88" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center"><a href="../photos.html">Photos</a></div></td>
                          <td width="95" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center"><a href="../aboutus.html" class="home1">About Us</a></div></td>
                          <td width="109" align="center" bordercolor="#000033" bgcolor="#1c3764"><div align="center"><a href="../contactus.html" class="home1">Contact Us</a></div></td>
                          <td width="82" align="center" bordercolor="#000033" bgcolor="#1c3764"><a href="../taiji.html" class="home1">Tai Ji</a></td>
                          <td width="95" align="center" bordercolor="#000033" bgcolor="#1c3764"><a href="../products.html" class="home1">Products</a></td>
                          <td width="174" align="center" bordercolor="#000033" bgcolor="#1c3764"><a href="../health-research.html" class="home1">Health & Research</a></td
                        >
                        </tr>
                      </table></td>
                      <td width="55"></td>
                    </tr>
                    <tr>
                      <td height="2"></td>
                      <td></td>
                    </tr>
                  </table></td>
                </tr>
              </table></td>
          </tr>
        </table></td>
      </tr>
    </table>
      <table width="993" align="center">
        <tr align="center" valign="middle">
          <th width="990" scope="col">
            <table width="100%" border="0">
              <tr>
                <th width="885" height="59" align="center" valign="middle" scope="row"><p> </p>
                  <p> </p>
                  <p> </p></th>
              </tr>
            </table>
          </th>
        </tr>
        <tr>
          <th align="center" valign="middle" scope="col"><table width="100%" border="0" align="center">
            <tr>
              <th width="408" align="right" valign="middle" scope="col"><p>Find us on</p></th>
              <th width="77" align="right" valign="middle" scope="col"><a href="http://www.facebook.com/pages/Chattanooga-Tai-Ji-Community/191399390872880?v=info#!/pages/Chattanooga-Tai-Ji-Community/191399390872880?v=wall"><img src="../images/buttons-banners/facebook.jpg" width="67" height="19" alt="facebook" longdesc="../images/Buttons-Banners/facebook.jpg" /></a></th>
              <th width="482" align="right" valign="middle" scope="col"><table width="217" height="21" border="0" align="right">
                <tr align="right">
                  <th width="211" valign="middle" scope="col"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
                    <fb:like href="taijicommunity.com" layout="button_count" show_faces="false" width="450" font="tahoma" colorscheme="dark"></fb:like>
                  </th>
                </tr>
              </table></th>
            </tr>
          </table></th>
        </tr>
        <tr>
          <th align="center" valign="middle" scope="col"><strong><a href="../index.html" target="_self">Home</a>    <a href="../taiji.html" target="_self">Tai Ji</a>    <a href="../classes.html" target="_self">Classes</a>    <a href="../instructors.html" target="_self">Instructors</a>   <a href="../photos.html">Photos</a>   <a href="../joinctjc.html" target="_self">Join CTJC</a>    <a href="../aboutus.html" target="_self">About Us</a>    <a href="../contactus.html" target="_self"> Contact Us</a>   <a href="../products.html">Products</a>   <a href="http://appliedtaiji.com/" target="_self">Applied Tai Ji</a>   <a href="http://eepurl.com/bvAyb">Subscribe </a></strong></th>
        </tr>
    </table></td>
</tr>
</table>
</body>
</html>

Running your page through the W3C validator shows a lot of errors, but what's preventing your styles from working is an unclosed style defintion beginning on line 52.
Change this:
.linkz td table .home1 td {
font-style: italic;
body {
body {
     background-image: url(images/variety/wave4.jpg);
     background-repeat: no-repeat;
     background-attachment:fixed;
     background-size: cover;
To this:
.linkz td table .home1 td {
     font-style: italic;
body {
     background-image: url(images/variety/wave4.jpg);
     background-repeat: no-repeat;
     background-attachment:fixed;
     background-size: cover;

Fixed Background Image

How can I get a fixed background image in my iWeb? The kind where it stays put and the text scrolls.

Can anyone help with this please?

Scrolling text is jumpy/pulsing when compressed

I'm making end credits using the scroll up text animation behavior in Motion 2.1.2. Whenever I compress it for DVD Studio Pro and insert it the text looks terrible. It is pulsing in and out and is hardly readable. I found a few other people who have had this problem, but no solutions that have helped.
I have done credits using the scrolling text in Final Cut without much problem, but for this project I need motion in order to use text of different sizes.
Here are my specs:
Project Properties - NTSC DV; 720x480; Pixel Aspect Ratio: NTSC D1/DV - 0.90; Field Order: Lower First (Even); Frame Rate: 29.97; Background color is black (0%)
Render Settings - Motion Blur Samples: 8; Shutter Angle: 360; Output Antialiasing Method: Best
I used Export using Compressor: DVD Best Quality 90 minutes 4:3; I tried using the Color+Alpha and just Color in the Output options. Premultiply alpha and Use field render are both checked. Use motion blur is not checked.
Most of the text is Geneva Regular 14 pt font. I have tried completely white as well as setting the RGB sliders all at 235 with no difference. I also tried using a black outline with no difference. The scroll up behavior has a rate of 52.
Please help! It took me forever to put these credits together and I don't want to start from scratch with another program. Making the text bigger helps a little bit but I would really like to keep it the same size for timing and format sake. However, I can't keep it like this because it looks terrible both on an Apple Cinema display and on a tv after burned to DVD.
Thanks!

My first guess would be the font itself. Geneva is a pretty thin font and it's not likely to look good interlaced and on a TV. Can you try a thicker font?
I'd also turn off Field Rendering. It looked much worse with it on than off. Keep Frame Blending though.
Andy

HT201109 Final Cut Pro 10.1 crashes with Motion 5.1 custom Scrolling text and Graphics titles

Dec 29, 2013 1:33 PM
found out why Final Cut 10.1 won't load my custom titles without crashing. When scrolling text in Motion 5.1 if you ad a graphic to scroll with the text Final Cut 10.1 will crash. If I remove the graphic in Motion and then load it into Final Cut 10.1 it will work.
So Graphics and scrolling do not work. The graphics are .jpg, .png, .tiff, .psd. I don't know how to fix it. Hopefully someone out there does.
Dave
Final Cut Pro X, OS X Mavericks (10.9.1), 2.8 GHz Intel Core i7 & 16 GB Ram
Final Cut Pro Quit Unexpectedly
Process:         Final Cut Pro [4123]
Path:            /Applications/Final Cut Pro.app/Contents/MacOS/Final Cut Pro
Identifier:      com.apple.FinalCut
Version:         10.1 (238755)
Build Info:      ProEditor-23875005025000000~5
App Item ID:     424389933
App External ID: 223682791
Code Type:       X86-64 (Native)
Parent Process: launchd [175]
Responsible:     Final Cut Pro [4123]
User ID:         501
Date/Time:       2013-12-28 12:37:04.233 -0500
OS Version:      Mac OS X 10.9.1 (13B42)
Report Version: 11
Anonymous UUID: E080EF73-4EC7-F729-7343-2C37817936C6

Thanks Tom for the advice. I have four external hard disks, all of them formatted with Mac OS Extended Journaled. On all devices (2TB) I have more than half free space. They are connected either with Thunderbolt or USB3 cables. Different manufactures: LaCie, Toshiba, WD and Samsung. I face the same crash problem if I connect a UBS drive 16GB or a any other device to the USB ports including the Sony Video camera connected with a USB1 cable. Same problem on ALL my computers! To work properly, I have to disconnect all USB devices and work only with internal hard disks. I also tried to format the MacbookPro (erasing the partitions with a new installation) but I have the same problem. I really lost hope...

How to add a scrolling text to display in a web part?

Hi,
I have 3 files in a doc library that is been referenced by a web part xml viewer in a page. I am referring only the xml file.
WarningMessage.xml
<script type="text/javascript" src="http://icare/sites/IT/tst/XmlWebParts/WarningMessage/WarningMessage.js"></script>
WarningMessage.js
<script type="text/javascript">
<
//set the marquee parameters
function init() { rtl_marquee.start(); }
var rtl_marquee_Text = 'JavaScript scrolling text';
var rtl_marquee_Direction = 'left';
var rtl_marquee_Contents='<span style="font-family:Comic Sans MS;font-size:12pt;white-space:nowrap;">' + rtl_marquee_Text + '</span>';
rtl_marquee = new xbMarquee('rtl_marquee', '19px', '90%', 6, 100, rtl_marquee_Direction, 'scroll', rtl_marquee_Contents);
window.setTimeout( init, 200);
</script>
and
xbMarquee.js
document.writeln('<style type="text/css">');
document.writeln(' div.marqueecenter1 { text-align: center; }');
document.writeln(' div.marqueecenter2 { margin- margin-right: auto; }');
document.writeln(' div.marqueeleft1 { text-align: left; }');
document.writeln(' div.marqueeleft2 { margin- margin-right: auto; }');
document.writeln(' div.marqueeright1 { text-align: right; }');
document.writeln(' div.marqueeright2 { margin- margin-right: 0; }');
document.writeln('</style>');
function xbMarquee(id, height, width, scrollAmount, scrollDelay, direction, behavior, html)
this.id = id;
this.scrollAmount = scrollAmount ? scrollAmount : 6;
this.scrollDelay = scrollDelay ? scrollDelay : 85;
this.direction = direction ? direction.toLowerCase() : 'left';
this.behavior = behavior ? behavior.toLowerCase() : 'scroll';
// this.name = 'xbMarquee_' + (++xbMarquee._name);
this.name = id;
this.runId = null;
this.html = html;
this.isHorizontal = ('up,down'.indexOf(this.direction) == -1);
if (typeof(height) == 'number')
this.height = height;
this.heightUnit = 'px';
else if (typeof(height) == 'string')
this.height = parseInt('0' + height, 10);
this.heightUnit = height.toLowerCase().replace(/^[0-9]+/, '');
else
this.height = 100;
this.heightUnit = 'px';
if (typeof(width) == 'number')
this.width = width;
this.widthUnit = 'px';
else if (typeof(width) == 'string')
this.width = parseInt('0' + width, 10);
this.widthUnit = width.toLowerCase().replace(/^[0-9]+/, '');
else
this.width = 100;
this.widthUnit = 'px';
// xbMarquee UI events
this.onmouseover = null;
this.onmouseout = null;
this.onclick = null;
// xbMarquee state events
this.onstart = null;
this.onbounce = null;
var markup = '';
if (document.layers)
markup = '<ilayer id="' + this.id + 'container" name="' + this.id + 'container" ' +
'height="' + height + '" ' +
'width="' + width + '" ' +
'clip="' + width + ', ' + height + '" ' +
'>' +
'<\/ilayer>';
else if (document.body && typeof(document.body.innerHTML) != 'string')
markup = '<div id="' + this.id + 'container" name="' + this.id + 'container" ' +
'style=" ' +
'height: ' + this.height + this.heightUnit + '; ' +
'width: ' + this.width + this.widthUnit + '; ' +
'clip: rect(0px, ' + this.width + this.widthUnit + ', ' + this.height + this.heightUnit + ', 0px); ' +
'">' +
'<div id="' + this.id + '" style="' +
(this.isHorizontal ? 'width:0px;' : '') + // if we scroll horizontally, make the text container as small as possible
'">' +
(this.isHorizontal ? '<nobr>' : '') +
this.html +
(this.isHorizontal ? '<\/nobr>' : '') +
'<\/div>' +
'<\/div>';
else
markup = '<div id="' + this.id + 'container" name="' +
this.id + 'container" ' +
'style=" overflowY: visible; ' +
'height: ' + this.height + this.heightUnit + '; ' +
'width: ' + this.width + this.widthUnit + '; ' +
'clip: rect(0px, ' + this.width + this.widthUnit + ', ' + this.height + this.heightUnit + ', 0px); ' +
'">' +
'<\/div>';
document.write(markup);
window[this.name] = this;
// Class Properties/Methods
xbMarquee._name = -1;
xbMarquee._getInnerSize = function(elm, propName)
var val = 0;
if (document.layers)
// navigator 4
val = elm.document[propName];
else if (elm.style && typeof(elm.style[propName]) == 'number')
// opera
// bug in Opera 6 width/offsetWidth. Use clientWidth
if (propName == 'width' && typeof(elm.clientWidth) == 'number')
val = elm.clientWidth;
else
val = elm.style[propName];
else
//mozilla and IE
switch (propName)
case 'height':
if (typeof(elm.offsetHeight) == 'number')
val = elm.offsetHeight;
break;
case 'width':
if (typeof(elm.offsetWidth) == 'number')
val = elm.offsetWidth;
break;
return val;
xbMarquee.getElm = function(id)
var elm = null;
if (document.getElementById)
elm = document.getElementById(id);
else
elm = document.all[id];
return elm;
xbMarquee.dispatchUIEvent = function (event, marqueeName, eventName)
var marquee = window[marqueeName];
var eventAttr = 'on' + eventName;
if (!marquee)
return false;
if (!event && window.event)
event = window.event;
switch (eventName)
case 'mouseover':
case 'mouseout':
case 'click':
if (marquee[eventAttr])
return marquee['on' + eventName](event);
return false;
xbMarquee.createDispatchEventAttr = function (marqueeName, eventName)
return 'on' + eventName + '="xbMarquee.dispatchUIEvent(event, \'' + marqueeName + '\', \'' + eventName + '\')" ';
// Instance properties/methods
xbMarquee.prototype.start = function ()
var markup = '';
this.stop();
if (!this.dirsign)
if (!document.layers)
this.containerDiv = xbMarquee.getElm(this.id + 'container')
if (typeof(this.containerDiv.innerHTML) != 'string')
return;
// adjust the container size before inner div is filled in
// so IE will not hork the size of percentage units
var parentNode = null;
if (this.containerDiv.parentNode)
parentNode = this.containerDiv.parentNode;
else if (this.containerDiv.parentElement)
parentNode = this.containerDiv.parentElement;
if (parentNode &&
typeof(parentNode.offsetHeight) == 'number' &&
typeof(parentNode.offsetWidth) == 'number')
if (this.heightUnit == '%')
this.containerDiv.style.height =
parentNode.offsetHeight * (this.height/100) + 'px';
if (this.widthUnit == '%')
this.containerDiv.style.width =
parentNode.offsetWidth * (this.width/100) + 'px';
markup += '<div id="' + this.id + '" name="' + this.id + '" ' +
'style=" ' +
//(this.isHorizontal ? 'width:0px;' : '') + // if we scroll horizontally, make the text container as small as possible
'" ' +
xbMarquee.createDispatchEventAttr(this.name, 'mouseover') +
xbMarquee.createDispatchEventAttr(this.name, 'mouseout') +
xbMarquee.createDispatchEventAttr(this.name, 'click') +
'>' +
(this.isHorizontal ? '<nobr>' : '') +
this.html +
(this.isHorizontal ? '<\/nobr>' : '') +
'<\/div>';
this.containerDiv.innerHTML = markup;
this.div = xbMarquee.getElm(this.id);
this.styleObj = this.div.style;
else /* if (document.layers) */
this.containerDiv = document.layers[this.id + 'container'];
markup =
'<layer id="' + this.id + '" name="' + this.id + '" top="0" left="0" ' +
xbMarquee.createDispatchEventAttr(this.name, 'mouseover') +
xbMarquee.createDispatchEventAttr(this.name, 'mouseout') +
xbMarquee.createDispatchEventAttr(this.name, 'click') +
'>' +
(this.isHorizontal ? '<nobr>' : '') +
this.html +
(this.isHorizontal ? '<\/nobr>' : '') +
'<\/layer>';
this.containerDiv.document.write(markup);
this.containerDiv.document.close();
this.div = this.containerDiv.document.layers[this.id];
this.styleObj = this.div;
if (this.isHorizontal && this.height < xbMarquee._getInnerSize(this.div, 'height') )
this.height = xbMarquee._getInnerSize(this.div, 'height')
this.containerDiv.style.height = this.height + this.heightUnit;
this.containerDiv.style.clip = 'rect(0px, ' + this.width + this.widthUnit + ', ' + this.height + this.heightUnit + ', 0px)';
// Start must not run until the page load event has fired
// due to Internet Explorer not setting the height and width of
// the dynamically written content until then
switch (this.direction)
case 'down':
this.dirsign = 1;
this.startAt = -xbMarquee._getInnerSize(this.div, 'height');
this._setTop(this.startAt);
if (this.heightUnit == '%')
this.stopAt = this.height * xbMarquee._getInnerSize(this.containerDiv, 'height') / 100;
else
this.stopAt = this.height;
break;
case 'up':
this.dirsign = -1;
if (this.heightUnit == '%')
this.startAt = this.height * xbMarquee._getInnerSize(this.containerDiv, 'height') / 100;
else
this.startAt = this.height;
this._setTop(this.startAt);
this.stopAt = -xbMarquee._getInnerSize(this.div, 'height');
break;
case 'right':
this.dirsign = 1;
this.startAt = -xbMarquee._getInnerSize(this.div, 'width');
this._setLeft(this.startAt);
if (this.widthUnit == '%')
this.stopAt = this.width * xbMarquee._getInnerSize(this.containerDiv, 'width') / 100;
else
this.stopAt = this.width;
break;
case 'left':
default:
this.dirsign = -1;
if (this.widthUnit == '%')
this.startAt = this.width * xbMarquee._getInnerSize(this.containerDiv, 'width') / 100;
else
this.startAt = this.width
this._setLeft(this.startAt);
// this.stopAt = -xbMarquee._getInnerSize(this.div,'width')*2;
// this method does not work very well with FireFox. offsetWidth property used in this function returns the absolute width of the div container
// instead of the new offsetWidth when innerHTML is added or when the div becomes wider. To overcome this a new span element is added to
// the document body to measure the new offsetwidth and then it is removed.
var temp_span = document.createElement('span');
temp_span.id = 'span_' + this.div.id;
temp_span.innerHTML = this.html;
document.body.appendChild(temp_span);
this.stopAt = - temp_span.firstChild.firstChild.offsetWidth;
document.body.removeChild(temp_span);
break;
this.newPosition = this.startAt;
this.styleObj.visibility = 'visible';
this.newPosition += this.dirsign * this.scrollAmount;
if ( (this.dirsign == 1 && this.newPosition > this.stopAt) ||
(this.dirsign == -1 && this.newPosition < this.stopAt) )
if (this.behavior == 'alternate')
if (this.onbounce)
// fire bounce when alternate changes directions
this.onbounce();
this.dirsign = -this.dirsign;
var temp = this.stopAt;
this.stopAt = this.startAt;
this.startAt = temp;
else
// fire start when position is a start
if (this.onstart)
this.onstart();
this.newPosition = this.startAt;
switch(this.direction)
case 'up':
case 'down':
this._setTop(this.newPosition);
break;
case 'left':
case 'right':
default:
this._setLeft(this.newPosition);
break;
this.runId = setTimeout(this.name + '.start()', this.scrollDelay);
xbMarquee.prototype.stop = function ()
if (this.runId)
clearTimeout(this.runId);
this.runId = null;
xbMarquee.prototype.setInnerHTML = function (html)
if (typeof(this.div.innerHTML) != 'string')
return;
var running = false;
if (this.runId)
running = true;
this.stop();
this.html = html;
this.dirsign = null;
if (running)
this.start();
// fixes standards mode in gecko
// since units are required
if (document.layers)
xbMarquee.prototype._setLeft = function (left)
this.styleObj.left = left;
xbMarquee.prototype._setTop = function (top)
this.styleObj.top = top;
else
xbMarquee.prototype._setLeft = function (left)
this.styleObj.left = left + 'px';
xbMarquee.prototype._setTop = function (top)
this.styleObj.top = top + 'px';
I have nothing displaying in the web-part. How can I make this to work?

This is how i was able to do it. Edit html source.
<div align="center"><marquee id='scroll_news4' bgcolor=#ff9966 "><font color="#000000" size="+1" ><strong>Outlook is down! IT is working on it! </strong></font></marquee></div>
<input type='Button' value='Stop' id ='b1' onClick='button_click()';>
<SCRIPT LANGUAGE="JavaScript">

</script>

Possible to show bottom of scrolling text first when icon is displayed?

Hi,
Does anyone know if it is possible to show the bottom of
scrolling text when the display comes up? For instance, let's say
you have 20 lines of text in a scrolling display, but it only has
room for 10. By default, Authorware shows the top 10 lines in the
scrolled display, not the bottom 10. I want to show the bottom
10--is this possible?
Thanks,
Edwin

Hi,
Well, I decided to have the most current information at the
top of the display. For instance, if it were a chat, the most
current chat info would be on top instead of on bottom. That fixed
the problem adequately.
Edwin

How to fix the size of table data in html

I want to fix the size of table data in html. ie if i want to insert only 50 char in a <td> field then it contain only 50 character, after that it switched to another line and contain the remaining character. Means <td> field wil not get automatically adjust there size according to data.

you cant specify how many characters a td cell can have but u can specify the pixel width of a td cell
<td width=50>
as long as you have wrap text on, then text will not force the box size over the 50 pixels
this wont limit it to only 50 chars though, you will probably have to use some javascript to cut the string down to size (unless youre using something like php or asp then that will do the trick too)

How to control background color of table cell in an html report?

I am using Labview 6.1 to generate a report. In that report there is a table created using the Append Numeric Table to Report VI. I want to be able to programmatically control the background color of each cell in the table. Also, how can I programmatically control the background color of the row and header cells of the same table. I am also generating a second table in the same report using the Append Text Table to Report VI and I would like to programmatically control the background colors of the cells in that table as well. Thanks.

Hi epsilon-d...,
i´m not sure if there is an ready to use function to do what you want, but you can enlarge the available function. Open the "Append Numeric Table to Report.vi" and go to the HTML Case. There you can see another vi which creates the html table. In the VI "HTML Report Table Row" you can add the option: bgcolor="your color" inside of the "TR" tag.
Hope it helps.
Mike

Fixed Background/Scrolling text table

Similar Messages

Maybe you are looking for