Acorn than you for all the help but I need you to walk me through what comes first here. I tried using this but nothing yet.
Printable View
Acorn than you for all the help but I need you to walk me through what comes first here. I tried using this but nothing yet.
This my source in preview mode
<head>
<meta name="XAR Files" content="index_htm_files/xr_files.txt"/>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252"/>
<meta name="Generator" content="Xara HTML filter v.4.1.1.671"/>
<link rel="stylesheet" type="text/css" href="index_htm_files/xr_main.css"/>
<link rel="stylesheet" type="text/css" href="index_htm_files/xr_text.css"/>
<script language="JavaScript" type="text/javascript">
<!--
function xr_rx(){var ww=document.documentElement.clientWidth;
xr_dx=(ww-parseInt(xr_xr.style.width))/2;var i=-parseInt(xr_xr.style.width)/2;
if(xr_dx<0){i-=xr_dx;xr_dx=0;};xr_xr.style.marginLeft=i+"px";
document.body.style.backgroundPosition=xr_dx+"px 0px";};
function xr_nn() {return(true);};
window.onresize=xr_rx; window.onload=xr_rx;
-->
</script>
(<style>
.xr_bgb0 {
/* Set background image to fixed (don't scroll along with the page) */
background-attachment: fixed;
}
</style>)
</head>
Did the example file work?
If so, can you create a design in your product that has an image repeated on the Pasetboard. by importing then removing from the page and then going to the Bitmap gallery and adding the image back with right-click Set pasteboard background?
At this point you will have a scrolling background.
Open Utilities > Web Properties > Page > HTML code (head).
Add the <script>...</script> styling, click OK and then the Apply.
When you Preview, the background is fixed.; reduce the height of your browser so the vertical scrollbars appears to see this in action.
The last wrinkle is to unlock the Page background, remove any shadow and set the page to 99% transparency.
Acorn
Just tried this and still nothing. I think I will give up on this effect.
<!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>
<meta name="XAR Files" content="index_htm_files/xr_files.txt"/>
<title>past</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252"/>
<meta name="Generator" content="Xara HTML filter v.4.1.1.671"/>
<link rel="stylesheet" type="text/css" href="index_htm_files/highslide.css" />
<!--[if lt IE 7]><link rel="stylesheet" type="text/css" href="index_htm_files/highslide-ie6.css" /><![endif]-->
<script type="text/javascript" src="index_htm_files/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="index_htm_files/xr_main.css"/>
<link rel="stylesheet" type="text/css" href="index_htm_files/xr_text.css"/>
<script type="text/javascript" src="index_htm_files/roe.js"></script>
<style>
.xr_bgb0 {
/* Set background image to fixed (don't scroll along with the page) */
background-attachment: fixed;
}
</style>
</head>
Just tried this and still nothing. I think I will give up on this effect.
NEVER GIVE UP!
Upload your design file.
Acorn
design file?? Where is that?
Well, I uploaded mine: CSS3 - Fixed Background.xar; it is what Xara allows you to save to allow a design to be published, shared or printed.
Acorn