我已经购买了Joomla的扩展程序!来自YouJoomla,因为他们的支持论是人类创造的最糟糕的事情,我想我会问你们。
我遇到的主要问题是Fx问题,或者可能是javascript冲突。
我试图通过名为YJK2Slider的插件向Joomla中的K2对象添加图像滑块。我应该做的唯一事情是安装插件,激活它,它应该工作正常。是的,但没有。它在加载时卡住并呈现图像0x0像素。然而,当我删除控制台告诉我的代码冲突时,它会加载图像,我可以从左向右滚动,但我不能使用缩略图,这几乎是一个关键功能。
这是滑块的完整js代码......
var YJK2SimpleSlide = new Class({
Implements: [Options],
options: {
outerContainer: null,
innerContainer: null,
elements: null,
navigation: {
forward: null,
back: null,
container: null,
elements: null,
outer: null,
visibleItems: 0
},
slideType: 0,
orientation: 1,
slideTime: 3000,
duration: 600,
tooltips: 0,
autoslide: 1,
navInfo: null,
navLinks: null,
startElem: null
},
initialize: function(options) {
this.setOptions(options);
this.navElements = $(this.options.navigation.container).getElements(this.options.navigation.elements);
this.navScroll = new Fx.Scroll(this.options.navigation.outer, {
link: 'cancel',
duration: 800,
transition: Fx.Transitions.Quad.easeInOut
});
this.correction = Math.round(this.options.navigation.visibleItems / 2.00001);
this.start()
},
start: function(){
this.currentElement = this.options.startElem;
this.direction = 1; // -1: back; 1:forward
this.elements = $(this.options.innerContainer).getElements(this.options.elements);
this.showEffect = {};
this.hideEffect = {};
this.firstRun = {};
if( this.options.slideType!==0 ){
if( this.options.orientation == 1 ){
this.showEffect.left = [1200,0];
this.hideEffect.left = [0,1200];
this.firstRun.left = 1200;
}else{
this.showEffect.top = [400,0];
this.hideEffect.top = [0,400];
this.firstRun.top = 400;
}
}
if( this.options.slideType!==1 ){
this.showEffect.opacity = [0,1];
this.hideEffect.opacity = [1,0];
this.firstRun.opacity = 0;
}
var fadeSliderIn = new Fx.Morph(this.options.outerContainer, {
duration: 3000,
transition: Fx.Transitions.Sine.easeOut
});
fadeSliderIn.start({
'visibility': 'visible',
'opacity': [0.001, 1]
});
var fadeNavIn = new Fx.Morph(this.options.navigation.container, {
duration: 3000,
transition: Fx.Transitions.Sine.easeOut
});
fadeNavIn.start({
'visibility': 'visible',
'opacity': [0.001, 1]
});
/* slides */
this.elements.each( function(el, i){
el.setStyles({
'display':'block',
'position':'absolute',
'top':0,
'left':0,
'z-index':(100-i)
});
if( this.options.slideType!==1 && i!==this.currentElement )
el.setStyle('opacity',0);
this.elements[i]['fx'] = new Fx.Morph(el, {link:'cancel', duration: this.options.duration});
if(i!==this.currentElement)
this.elements[i]['fx'].set(this.firstRun);
el.addEvent('mouseenter', function(event){
//$clear(this.period);
clearTimeout(this.period);
}.bind(this));
el.addEvent('mouseleave', function(event){
if(this.options.autoslide==1){
this.resetAutoslide();
}
}.bind(this));
}.bind(this));
/* autoslide on command */
if(this.options.autoslide == 1){
this.period = this.rotateSlides.periodical(this.options.slideTime, this);
}
/* add navigation */
this.setNavigation();
if(this.options.navLinks){
this.secondNavigation();
$(this.options.navigation.container).addEvent('mousewheel', function(event){
event = new Event(event);
//event.stop();
event.preventDefault();
var dir = event.wheel > 0 ? 1 : -1;
var el = this.currentElement - dir;
//var el = this.currentElement-event.wheel;
if( event.wheel > 0 && el < 0 ) el = this.navElements.length-1;
if( event.wheel < 0 && el > this.navElements.length-1 ) el = 0;
if( this.options.autoslide == 1 ){
//$clear(this.period);
clearTimeout(this.period);
this.resetAutoslide();
}
this.nextSlide(el);
}.bind(this));
}
},
rotateSlides: function(){
var next = this.currentElement+this.direction;
if( next < 0 ) next = this.elements.length-1;
if( next > this.elements.length-1) next = 0;
this.nextSlide(next);
},
nextSlide: function(slide){
if(slide==this.currentElement) return;
this.elements[this.currentElement]['fx'].start(this.hideEffect);
this.elements[slide]['fx'].start(this.showEffect);
this.currentElement = slide;
if($(this.options.navInfo)){
$(this.options.navInfo).setHTML('Link '+(slide+1)+' of '+this.elements.length);
}
//if($defined(this.navElements)){
if(this.navElements !== undefined && this.navElements !== null){
this.navElements.removeClass('selected');
this.navElements[slide].addClass('selected');
/* slide to element */
var navTo = slide-this.correction < 0 ? 0 : slide-this.correction;
if( navTo+this.correction >= this.navElements.length-this.correction ) navTo = (this.navElements.length-1) - this.correction*2;
this.navScroll.toElement(this.navElements[navTo]);
}
},
setNavigation: function(){
if(!$(this.options.navigation.forward)) return;
$(this.options.navigation.forward).addEvent('click', function(event){
//new Event(event).stop();
event.preventDefault();
this.direction = 1;
if (this.options.autoslide == 1) {
this.resetAutoslide();
}
this.rotateSlides();
}.bind(this));
$(this.options.navigation.back).addEvent('click', function(event){
//new Event(event).stop();
event.preventDefault();
this.direction = -1;
if (this.options.autoslide == 1) {
this.resetAutoslide();
}
this.rotateSlides();
}.bind(this));
},
resetAutoslide: function(){
//$clear(this.period);
clearTimeout(this.period);
this.period = this.rotateSlides.periodical(this.options.slideTime, this);
},
secondNavigation: function(){
this.navElements = $$(this.options.navLinks);
this.navElements.each(function(el,i){
if( i == this.currentElement ){
this.navScroll.toElement(el);
el.addClass('selected');
}
el.addEvent('click', function(event){
//new Event(event).stop();
event.preventDefault();
this.resetAutoslide();
this.nextSlide(i);
}.bind(this));
}.bind(this));
}
});
window.addEvent('domready', function() {
$$('#SimpleSlide_outer').setStyles({
boxShadow: '0px 0px 3px 1px #d8d8d8',
WebkitBoxShadow:'0px 0px 3px 1px #d8d8d8',
MozBoxShadow:'0px 0px 3px 1px #d8d8d8'
});
});
......这就是搞砸它的部分。
this.navScroll = new Fx.Scroll(this.options.navigation.outer, {
link: 'cancel',
duration: 800,
transition: Fx.Transitions.Quad.easeInOut
});
下面是我想放置滑块的链接; http://dev9.hosterspace.com/pyramiden/index.php/projekt/utbildning/item/4-campus-varberg 继承人开发者演示网站; http://extensions.youjoomla.info/yj-k2-image-slider.html
任何人都可以帮助我吗? :)
答案 0 :(得分:0)
问题是我的Joomla!安装不包括默认应包含的mootools-more.js。当我添加它的东西是游泳的时候!