Web Banner Image Fade

Question

I'm an experienced Java Architect with no experience of JavaFX. I'm trying to develop a proof of concept Flash-style web banner to see if it is feasible to replace existing Flash elements on my client's site with JavaFX elements, thus removing the need for a costly proprietary RIA toolkit.
Now the banner in question takes a physical URL from an XML document, loads a set number (also configured in a simple XML document) of images horizontally across the banner. It fades each image out independently and once invisible, it replaces that image with another random image from the URL and fades back in (ensuring it doesn't already exist in the other visible images). Whilst doing this, a quote is displayed across the images in a colour set by the XML file, and this quote fades in and out as well, changing to another quote from a set list, and fading back in once the new quote is found.
Now I'm sure I can figure out some of the more typical functionality that I come across with Java, C++, etc. on a daily basis, such as interacting with an XML document, and loading images from URLs (perhaps), but the actual timing, fading, working loading new images and quotes at the right time, etc. is all new as I tend to develop business systems and not applications with visual effects. So help is needed on how to best go about doing this. I've begun with a very basic attempt at a Stage and tips on going forward would be appreciated.
Also, as a side note, in JavaFX how would I extend the Stage and Scenes, and any other object, essentially, and then load them as variables...? remember I'm an OO-oriented Java and C++ programmer, so I understand inheritance, but cannot seem to find the right syntax in JavaFX after an hour working on this basic Flash-eliminating challenge.
My code is below:
package ribbon;
import javafx.animation.Interpolator;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;
//capture the dynamic width and height of the scene
var width: Number = bind scene.width;
var height: Number = bind scene.height;
var quote: Text = Text {
    font: Font {
        size: 16
    x: 10,
    y: 30,
    fill: Color.RED
    opacity: bind angle
    content: "Interesting quote goes here..."
var scene: Scene = Scene {
    fill: Color.BLACK
    content: [
        Rectangle {
            x: 0,
            y: bind height - 30
            width: bind width,
            height: 25
            arcHeight: 5
            arcWidth: 5
            fill: Color.BLACK
            opacity: 0.5
        quote,
var angleStart = 1.0;
var angle = angleStart;
var fade = Timeline {
    keyFrames: [
        KeyFrame {
            time: 0s
            values: angle => angleStart tween Interpolator.LINEAR
        KeyFrame {
            time: 3s
            values: angle => 0.2 tween Interpolator.LINEAR
    autoReverse: true
    repeatCount: 1000
var stage = Stage {
    title: "Photo Ribbon"
    width: 680
    height: 100
    scene: scene
fade.play();
stage;Thanks in advance.

Answer 1

If the banner image is not displaying, it is either not in an acceptable web file format (optimized for web as jpg, gif or png). Or it is corrupted.  Or the path to the image file on server is broken. 
It's impossible to say more without a link to your problem page.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists 
http://alt-web.com/