285 Posts in 113 Topics by 152 members
Connect With Other SilverStripe Members
SilverStripe Forums » Connect With Other SilverStripe Members » Bakground Auto-Scrolling-Down
For all SilverStripe-related topics that don't fit into any of the categories above.
Moderators: martimiz, Howard, Sean, Ryan M., biapar, Willr, Ingo, swaiba
|
Page:
1
|
Go to End | |
| Author | Topic: | 1098 Views |
-
Bakground Auto-Scrolling-Down
27 February 2010 at 12:12am Last edited: 27 February 2010 12:42am
Hi to all,
im new there, i wanna use silverstripe cms for make my personal site:i need to move the Bakground automactly, like climbing down of the rain,
i found surfing the internet this VB script ... but i cant introduce it on my cms site.
the script who i found have the problem that it can run only on IE, but i need it work on all platform.
who can help me ???
thanksQuiero hacer un sitio cuyo fondo que se está moviendo, ello hacia abajo como la lluvia.. pero en css.
jo encontrado un VBScript pero no sé cómo hacer lo mismo en CSS. Cómo puedo convertir Vb script en CSS ??
Te envÃo un ejemplo de esso, que funciona sólo en IE, me gustarÃa que esto funcione en Firefox tambien.the script whit a little html is:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
</head>
<body style="background-image: url('http://conme.files.wordpress.com/2007/06/goccia-luna-rossa.jpg')">
</body>
<SCRIPT language=VBScript>
dim MoveItX, MoveItY, mnumfond
MoveItY=0
MoveItX=0
numfond=document.body.sourceIndex
SUB SF
MoveItY=MoveItY-1
MoveItX=MoveItX+0
Document.all(numfond).style.BackgroundPosition= MoveItX & " " & MoveItY
id=SetTimeOut("SF",10,"VBScript")
End Sub
SF</SCRIPT>
</html>
-
Re: Bakground Auto-Scrolling-Down
27 February 2010 at 2:42am
what do you think about that??
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fondo animado</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script><style type="text/css" media="screen">
body{
background-color: #C0DEED;
margin:0;
padding:0;
}#header{
height:180px;
background: #8EC1DA url(http://conme.files.wordpress.com/2007/06/goccia-luna-rossa.jpg) repeat-y scroll left top;
text-align:center;
margin-top:-30px;
}#header h1{
padding-top:35px;
font-family: "Myriad Pro", Helvetica, Arial, sans-serif;
color:white;
font-size:45px;
}#content{
background-color:#fff;
height:500px;
width:980px;
margin:25px auto 0 auto;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
</style><script type="text/javascript" charset="utf-8">
var scrollSpeed = 70;
var step = 1;
var current = 0;
var imageWidth = 2247;
var headerWidth = 800;var restartPosition = -(imageWidth - headerWidth);
function scrollBg(){
current -= step;
if (current == restartPosition){
current = 0;
}$('#header').css("background-position",current+"px 0");
}var init = setInterval("scrollBg()", scrollSpeed);
</script></head>
<body>
<div id="container">
<div id="header">
<h1>Animated Background Image</h1>
</div><!-- #header --><div id="content">
<!-- Your content will go here -->
</div><!-- #content -->
</div><!-- #container --></body>
</html>
| 1098 Views | ||
|
Page:
1
|
Go to Top |
