I found a script at on the web that emulates the news scroller found at [COLOR=#336699]www.Carldekeyser.com[/COLOR]. I would like to add images to each news headline so it can replicate the effect found at carldekeyser.com. Can someone please give me assistance.
stop();
//
// for easing
import mx.transitions.*;
import mx.transitions.easing.*;
//
// set the stage to publish html at 100%
Stage.align = "TL";
Stage.scaleMode = "noScale";
//
// arrays and movie clips
var smItems:Array = new Array(); // array of small size news items
var origSmItems:Array = new Array(); // handy to have a copy that doesn't get sorted for button scrolling
var lgItems:Array = new Array(); // array of large size news items
var linkItems:Array = new Array(); // array of links
var smItems_mc:MovieClip = this.createEmptyMovieClip("si", this.getNextHighestDepth()); // holds small news items
smItems_mc.swapDepths(block_mc); // put the small items behind the box that displays the big items
var lgItems_mc:MovieClip = this.createEmptyMovieClip("li", this.getNextHighestDepth()); // holds large news items
//
// set the coordinates and mask the biggies
smItems_mc._x = 250;
smItems_mc._y = 270;
lgItems_mc._x = 225;
lgItems_mc._y = 250;
lgItems_mc.setMask(mask_mc);
//
// news item currently displayed in box and the last news item to be displayed to be displayed in box
var curNews:MovieClip;
var oldNews:MovieClip;
//
// some numbers
var numItems:Number = 0; // number of news items (will be reset after xml is loaded)
var curScrolled:Number = 0; // number to aid in easing scroll
var scrollAmt_big:Number = 150; // how much to scroll large news items (movie clips are 100 px high)
var scrollAmt_sm:Number = 80; // how much to scroll small news items (mc's are 60 px high - add a 20 px buffer)
var nowScrolling:Number = 0; // will be setInterval to scroll each item one at a time
//
// standard xml stuff to fill arrays and attach movie clips
var newsXml:XML = new XML();
newsXml.ignoreWhite = true;
newsXml.onLoad = function(good) {
if (good) {
var myNews:Array = this.firstChild.childNodes;
var len:Number = myNews.length;
for (var i = 0; i < len; i++) {
// "ni" == "news item" (large and small)
// the news item movie clips are simply movie clips containing dynamic text boxes and an
// invisible hit area (for ease of clicking)
// the large news items are 350x100 pixels
// the small news items are 250x60 pixels
var ni_l:MovieClip = lgItems_mc.attachMovie("newsItem_lg", "ni_l" + i, lgItems_mc.getNextHighestDepth(), {_y:i * scrollAmt_big});
var ni_s:MovieClip = smItems_mc.attachMovie("newsItem_sm", "ni_s" + i, smItems_mc.getNextHighestDepth());
ni_s._y = i * scrollAmt_sm;
if (i > 0) {
// add 50 pixels to get small item below display box - tricky math, man
ni_s._y += 50;
}
ni_s.id = i; // unique id number
// populate arrays
lgItems.push(ni_l);
smItems.push(ni_s);
origSmItems.push(ni_s);
linkItems.push(myNews*.firstChild.nextSibling.nextSibling.firstChild);
// fill the text fields
ni_s.hl_txt.htmlText = ni_l.hl_txt.htmlText = myNews*.firstChild.firstChild;
ni_s.info_txt.htmlText = ni_l.info_txt.htmlText = myNews*.firstChild.nextSibling.firstChild;
}
initMenu();
} else {
trace("couldn't load");
}
};
//
// don't want the buttons clicked during the animation or bad things will happen
function setBtns(whichWay:Boolean):Void {
up_btn.enabled = whichWay;
down_btn.enabled = whichWay;
for (menItem in smItems){
smItems[menItem].enabled = whichWay;
}
}
//
// set up the on release actions for the recently attached movie clips
function initMenu():Void {
numItems = smItems.length;
curNews = smItems[0];
curNews.enabled = false;
for (var i = 0; i < numItems; i++) {
var menItem_sm:MovieClip = smItems*;
var menItem_bg:MovieClip = lgItems*;
menItem_sm.onRelease = function() {
// turn off the up/down scroll buttons so they're not clicked during the animation
setBtns(false);
// calculate distance between current item and selected item
// and sort the arrays to move in correct direction...
var m:Number = this.id - curNews.id;
if (m > 0) {
smItems = smItems.sort();
lgItems = lgItems.sort();
} else {
smItems = smItems.sort(2);
lgItems = lgItems.sort(2);
}
// swap out the curNews mc
curNews.enabled = true;
oldNews = curNews;
curNews = this;
curNews.enabled = false;
curScrolled = 0;
// set an interval to scroll each mc one at a time
nowScrolling = setInterval(moveMenuItems, 100, m);
};
}
// set up the "read more" button to open link according to curNews displayed
block_mc.go_btn.onRollOver = function() {
var tip:MovieClip = this._parent.attachMovie("tip", "t", 9999, {_x:this._parent._xmouse, _y:this._parent._ymouse});
tip.onMouseMove = function() {
this._x = this._parent._xmouse;
this._y = this._parent._ymouse;
updateAfterEvent();
};
};
// remove the tool tip on roll out
block_mc.go_btn.onRollOut = block_mc.go_btn.onDragOut = function () {
this._parent.t.removeMovieClip();
};
// open the news story in a new browser window
block_mc.go_btn.onRelease = function() {
getURL(linkItems[curNews.id], "_blank");
};
//
// set up the scroll buttons
up_btn.onRelease = function() {
if (curNews.id != 0) {
origSmItems[curNews.id - 1].onRelease();
}
};
down_btn.onRelease = function() {
if (curNews.id != numItems - 1) {
origSmItems[curNews.id + 1].onRelease();
}
};
// view the code and the xml file
code_btn.onRelease = function() {
getURL("scrollerAS.txt", "_blank");
};
xml_btn.onRelease = function() {
getURL("news.xml", "_blank");
};
}
//
// easing function to move the movieclips..
// b==big s==small (i.e. big movie clip, small end y value, etc)
function easeMenuItem(smc:MovieClip, bmc:MovieClip, sendy:Number, bendy:Number):Void {
var time:Number = 15;
var easeType:Function = Strong.easeOut;
var tweenListener:Object = new Object();
tweenListener.onMotionFinished = function() {
// i.e if the last item to animate is done moving - make the scroll buttons functional again
if (bmc == lgItems[lgItems.length - 1]) {
setBtns(true);
}
};
var yTween_lg:Tween = new Tween(bmc, "_y", easeType, bmc._y, bendy, time);
var yTween_sm:Tween = new Tween(smc, "_y", easeType, smc._y, sendy, time);
yTween_lg.addListener(tweenListener);
}
//
// the setInterval function which calls the easing function
function moveMenuItems(mult:Number):Void {
var bty:Number = lgItems[curScrolled]._y - (mult * scrollAmt_big);
var sty:Number = smItems[curScrolled]._y - (mult * scrollAmt_sm);
// these if statements account for the large box (that is it will add or subtract
// 50 from the target y value depending on the location of the scrolling movie clip
// yes, it's a pain
if (mult > 0) {
if (smItems[curScrolled].id > oldNews.id && smItems[curScrolled].id <= curNews.id) {
sty -= 50;
}
} else if (mult < 0) {
if (smItems[curScrolled].id > curNews.id && smItems[curScrolled].id <= oldNews.id) {
sty += 50;
}
}
easeMenuItem(smItems[curScrolled], lgItems[curScrolled], sty, bty);
if (curScrolled++ >= numItems) {
clearInterval(nowScrolling);
}
}
//
// start out by loading the xml file with your news...
newsXml.load("news.xml");
The XMl file structure is
<?xml version="1.0" encoding="UTF-8" ?>
- <news>
- <item>
<headline>Zombie Dogs</headline>
<teaser>US Scientists revive dogs three hours after clinical death...</teaser>
<link>http://www.news.com.au/story/0,10117,15739502-13762,00.html</link>
</item>
- <item>
<headline>Educational Sandwich</headline>
<teaser>16 year old student has threesome with 2 female teachers. He isn't complaining...</teaser>
<link>http://www.guardian.co.uk/uklatest/story/0,1271,-5112423,00.html</link>
</item>
- <item>
<headline>Black Box Predicts Future</headline>
<teaser>Scientists unwittingly discover how to predict the future...</teaser>
<link>http://www.rednova.com/news/display/?id=126649#121</link>
</item>
- <item>
<headline>Incomplete Manifesto</headline>
<teaser>A manifesto of growth by Bruce Mau...</teaser>
<link>http://www.brucemaudesign.com/manifesto.html</link>
</item>
</news>
