xpathを使用したフォトライブラリー(2)無限スクロールメニュー

解説

xpathを使用し、外部データと連動させた
プォトライブラリーです。
よくあるスクロールナビゲーションで、
無限にループして見せれます。

写真は外部データからロードして表示され、
サンプルでは写真8枚ですが、
写真の枚数は任意に変更出来ます。
写真のサイズや、スライドのスピードなど、
簡単にカスタマイズ出来ます。
詳しくはソースをご覧下さい。

xpathを使用しているので、XPath4AS2をダウンロードしないと
パブリッシュが出来ないので、
下記の作業を必ず行って下さい。

xpathのダウンロード作業

このページの一番下にあるflaファイル一式をダウンロードして下さい。

続いてxfactorstudioのサイトからXPath4AS2をダウンロードすると
comというフォルダがダウンロード出来ます。
flaファイル一式を解凍したフォルダ内にcomのフォルダを
下記写真のように置いて下さい。

 

scroll_001.png

 

//初期値
speed = 20;//スライドの速度
Num = 0;//ボタンから代入される変数の初期値
moveNum = 0;//ボタンから代入される変数
pWidth = 260;//写真のサイズ
pSpace = 40;//写真と写真の間隔
pTotal = pWidth+pSpace;//写真のサイズと間隔の合計値
//xpathの実行。
import com.xfactorstudio.xml.xpath.*;
function loadXML(xmlValue) {
foodXmlRoot = new XML();
foodXmlRoot.ignoreWhite = true;
foodXmlRoot.onLoad = function(success:Boolean) {
if (success) {
//XMLのロードが成功したら、下に定義したxpathLoad関数を実行します。
removef_bg();
xpathLoad();
retsu();
} else {
trace("XMLのロードに失敗しました。");
}
};
foodXmlRoot.load(xmlValue);
}
function xpathLoad() {
//ノードを辿って、指定の要素にアクセスする。
var pUrl:Array = XPath.selectNodes(foodXmlRoot, "photo/jpg/text()");
//写真のロード
pLoad(pUrl);
}
//xmlのファイル名
loadXML("xml/album1.xml");
//写真のロード
function pLoad(xmlLength) {
var i:Number;
pNum = xmlLength.length;
for (i=0; i0) {
this._x += Min;
} else if (this._x

サンプルファイルのダウンロード

サンプルファイル

投稿者:

kishiken

企業務めのWEBデザイナーです。