I have this little code wich is working quite good, it makes a slide
show on the body background, anyone could guide me on how to add a
fade effect as a transition between the images??
var Pic = new Array('cow2.jpg','cow3.jpg','cow4.jpg');
j=0;
p=Pic.length;
function preLoad() {
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
}
function runBGSlideShow(){
document.body.background = Pic[j];
j++;
if (j (p-1)){
j=0
}
setTimeout('runBGSlideShow()', 2000);
}
</script>
</head>
<body onload="runBGSlideShow();preLoad()">
4  2268 
On 4ÔÂ28ÈÕ, ÉÏÎç4ʱ00·Ö, tetris <tetri...@gmail.com>wrote:
I have this little code wich is working quite good, it makes a slide
show on the body background, anyone could guide me on how to add a
fade effect as a transition between the images??
var Pic = new Array('cow2.jpg','cow3.jpg','cow4.jpg');
j=0;
p=Pic.length;
function preLoad() {
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
}
function runBGSlideShow(){
document.body.background = Pic[j];
j++;
if (j (p-1)){
j=0}
setTimeout('runBGSlideShow()', 2000);
}
</script>
</head>
<body onload="runBGSlideShow();preLoad()">
You can use the JQuery. There are already some method to make
animation in JQuery.
On 28 avr, 03:41, None <jdxyw2...@gmail.comwrote:
On 4ÔÂ28ÈÕ, ÉÏÎç4ʱ00·Ö, tetris <tetri...@gmail.comwrote:
I have this little code wich is working quite good, it makes a slide
show on the body background, anyone could guide me on how to add a
fade effect as a transition between the images??
var Pic = new Array('cow2.jpg','cow3.jpg','cow4.jpg');
j=0;
p=Pic.length;
function preLoad() {
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
}
function runBGSlideShow(){
document.body.background = Pic[j];
j++;
if (j (p-1)){
j=0}
setTimeout('runBGSlideShow()', 2000);
}
</script>
</head>
<body onload="runBGSlideShow();preLoad()">
You can use the JQuery. There are already some method to make
animation in JQuery.
i dont want to use frameworks
On Apr 28, 3:40 pm, tetris <tetri...@gmail.comwrote:
On 28 avr, 03:41, None <jdxyw2...@gmail.comwrote:
On 4ÔÂ28ÈÕ, ÉÏÎç4ʱ00·Ö, tetris <tetri...@gmail.comwrote:
I have this little code wich is working quite good, it makes a slide
show on the body background, anyone could guide me on how to add a
fade effect as a transition between the images??
var Pic = new Array('cow2.jpg','cow3.jpg','cow4.jpg');
j=0;
p=Pic.length;
function preLoad() {
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
}
function runBGSlideShow(){
document.body.background = Pic[j];
j++;
if (j (p-1)){
j=0}
setTimeout('runBGSlideShow()', 2000);
}
</script>
</head>
<body onload="runBGSlideShow();preLoad()">
You can use the JQuery. There are already some method to make
animation in JQuery.
i dont want to use frameworks
It is normally done using setTimeout or setInterval to step through
various levels of opacity with a pause of say 50ms between steps -
increasing one image while decreasing the other. Search the archives
for "fade opacity".
You might like to look at this post in another group by Peter
Michaux :
<URL: http://groups.google.com/group/forkj...478a40367d215#
>
There was also a thread there on opacity performance - it's a little
old now but likely much of it still applies. It also suggests
strategies for ensuring the fade works well in different browsers and
slower platforms.
--
Rob
On 28 avr, 08:45, RobG <rg...@iinet.net.auwrote:
On Apr 28, 3:40 pm, tetris <tetri...@gmail.comwrote:
On 28 avr, 03:41, None <jdxyw2...@gmail.comwrote:
On 4ÔÂ28ÈÕ, ÉÏÎç4ʱ00·Ö, tetris <tetri...@gmail.comwrote:
I have this little code wich is working quite good, it makes a slide
show on the body background, anyone could guide me on how to add a
fade effect as a transition between the images??
var Pic = new Array('cow2.jpg','cow3.jpg','cow4.jpg');
j=0;
p=Pic.length;
function preLoad() {
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
}
function runBGSlideShow(){
document.body.background = Pic[j];
j++;
if (j (p-1)){
j=0}
setTimeout('runBGSlideShow()', 2000);
}
</script>
</head>
<body onload="runBGSlideShow();preLoad()">
You can use the JQuery. There are already some method to make
animation in JQuery.
i dont want to use frameworks
It is normally done using setTimeout or setInterval to step through
various levels of opacity with a pause of say 50ms between steps -
increasing one image while decreasing the other. Search the archives
for "fade opacity".
You might like to look at this post in another group by Peter
Michaux :
<URL:http://groups.google.com/group/forkj...m/thread/05d47....
There was also a thread there on opacity performance - it's a little
old now but likely much of it still applies. It also suggests
strategies for ensuring the fade works well in different browsers and
slower platforms.
--
Rob- Masquer le texte des messages pr¨¦c¨¦dents -
- Afficher le texte des messages pr¨¦c¨¦dents -
thanks for your reply, i have found the effect but they are generally
implemented over a div on the document, i've been trying to tweak it
to get to the body.background of the document, will keep on trying.. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: erik |
last post by:
Is it posssible to inherit the previous pages (parent pages)
background image? Is there a script out there I could look at? Thanks
|
by: Markus Mohr |
last post by:
Hi, everyone,
I have a special problem:
For every monitor resolution in 200 pixel steps from 800 to 1600
pixels I have an image to be shown as centered background-image.
Those images all...
|
by: Kevin Yu |
last post by:
When I declare on HTML page
<LINK href="mycss.css" type="text/css" rel=stylesheet />
....
<BODY class=myclass>
in mycss.css
BODY { FONT-WEIGHT: bold; FONT-SIZE: 12px; FONT-FAMILY:...
|
by: Giggle Girl |
last post by:
Hi there,
I need to use a background image in a TR that does NOT restart
everytime it hits a TD. Can it be done?
Specifically, if you set a background image for an entier table, now
mater how...
|
by: Nilesh |
last post by:
I am using background-image attribute in a CSS file and linking the
CSS file to aspx page. But strangly, background-image attribute is not
working for relative URL.
e.g. If I apply following css...
|
by: Viken Karaguesian |
last post by:
Hello all,
I need somehelp with background tiling. I have a sneaking suspicion that
what I want to do is not possible, but I'll ask anyway. :>) First some
background: Here's the site in...
|
by: Patrick |
last post by:
Hi All,
I am trying more and more to incorporate CSS into my work here. I have
currently been playing around with fluid design and tableless layout.
Currently I am trying to make a background...
|
by: Rob |
last post by:
Hello,
I'm sure this has come up before. I have need for a collection of all
elements/objects in an HTML document that have any kind of an
attribute (HTML or CSS) that is making use of a URL to...
|
by: stevedude |
last post by:
CSS newbie again. I have a problem trying to get coffee mug images
within anchor tags to center with my link text for a vertical list
menu. If I use the horizontal/vertical properties of...
|
by: thephatp |
last post by:
I'm having a problem with IE rendering correctly. I'm experimenting with using all div's in my pages now, and I'm not very familiar with the quirks of IE.
I have created a sample page, and I'm...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
| |
