Помощ при програмиране, отговори на въпроси / Javascript / Безкраен стенен javascript / mootools - javascript, wordpress, mootools

Безкраен JavaScript / mootools - javascript, wordpress, mootools

Опитвам се да създам и безкрайна плъзгаща се стена на wordpress с помощта на този скрипт: http://wall.plasm.it/ , Проблемът, пред който съм изправен, е, че не знам как бих могъл да грабвам постове за WordPress и да ги вмъквам в решетката на стената.

Това е кодът, който инициализира стената:

window.addEvent("domready", function(){
// Define The Wall
var maxLength    = 100; // Max Number images
var counterFluid = 1;
var wallFluid = new Wall("wall", {
"draggable":true,
"inertia":true,
"width":150,
"height":150,
"rangex":[-100,100],
"rangey":[-100,100],
callOnUpdate: function(items){
items.each(function(e, i){
var a = new Element("img[src=/your/folder/images/"+counterFluid+".jpg]");
a.inject(e.node).fade("hide").fade("in");
counterFluid++;
// Reset counter
if( counterFluid > maxLength ) counterFluid = 1;
})
}
});
// Init Fluid Wall
wallFluid.initWall();
});

Трябва да намеря начин да направя „нов елемент“, да вземем вече съществуваща публикация в wordpress или да добавя нов с помощта на ajax, въпреки че мисля, че това би го направило наистина бавно. Някакви идеи как бих могъл да направя тази работа?

Отговори:

0 за отговор № 1

Мисля, че това, което искате да направите, е да настроите Wordpress Query, за да получите публикациите, които искате, чрез ajax заявка. Те ще бъдат върнати в масива на вашите елементи, вместо изображенията във вашия пример.

0 за отговор № 2

Ако страницата е базирана на стандартен Wordpressструктура Не виждам никаква полза от използването на AJAX тук. Най-лесният начин би бил да вземете стълбовете и да ги поставите вътре в стената. Така че този скрипт, в случай на повече от един пост, създава html елементи на стената, задава основния css, приема постовете и ги поставя вътре в стената. Се основава на това пример.

window.addEvent( "domready", function() {

if ( $$( ".post" ).length > 1 ) {
// create base container for the wall
new Element( "div#wall_container" ).setStyles({
width:      608,
position:   "relative",
margin:     "0 auto"
}).inject( $$( ".post" )[0], "before" );

// create viewport, wall, and navigation
new Element( "div#viewport" ).setStyles({
width:      608,
height:     450,
position:   "relative",
overflow:   "hidden",
}).inject( "wall_container" );

new Element( "div#wall" ).inject( "viewport" );
new Element( "div#wall-list" ).inject( "viewport", "after" );

// collect all posts ( elements with class="post" ) and dispose them
var posts = $$( ".post" ).dispose();

new Wall( "wall", {
"draggable":    true,
"inertia":      true,
"autoposition": true,
"preload":      true,
"width":        608,
"height":       450,
"rangex":       [ 0, posts.length ],    // use number of posts for number of items in the wall
"rangey":       [ 0, 1 ],               // only one line
callOnUpdate: function( items ) {
items.each( function(e, i) {
posts[e.y].inject(e.node);      // inject posts into wall
});
}
})  .initWall()
.getListLinksPoints( "wall-list" );
}

});

Сценарисът на стената е предназначен предимно за изображения,а не за текст, защото всички елементи са абсолютно позиционирани с фиксирани размери (освен ако постовете са сходни по дължина, които могат да бъдат фиксирани и с използването на Повече ▼ маркер).

Изпитът се тества с WP 3.8.1, по теми по подразбиране. За да работите трябва Поставяне в опашката следните скриптове: