(Bild) Slider funktioniert nicht
-
- Posts: 45
- Joined: Sun 13. Jul 2008, 10:45
(Bild) Slider funktioniert nicht
Liebes Forum,
meine zahlosen Versuche mit fast allen hier im Forum vertretenen Slider Arten sind leider gescheitert. Selbstz der Standard Slider tut nicht.
Siehe ganz unten: http://www.unterwwwegs.de/index.php?som ... nce-tour-1
Auch die Lösung von swisscheese läuft nicht: http://www.hykom.bluthard-online.de/index.php?test-3
Mootools laden ist angekreuzt. Ich vermute es liegt an einer Kleinigkeit - diese konnte ich aber trotz Vergleich HTML Dateien mit funktionierenden Seiten nicht finden.
Ich wäre um eine Lösung dankbar.
Gruß
Rainer
meine zahlosen Versuche mit fast allen hier im Forum vertretenen Slider Arten sind leider gescheitert. Selbstz der Standard Slider tut nicht.
Siehe ganz unten: http://www.unterwwwegs.de/index.php?som ... nce-tour-1
Auch die Lösung von swisscheese läuft nicht: http://www.hykom.bluthard-online.de/index.php?test-3
Mootools laden ist angekreuzt. Ich vermute es liegt an einer Kleinigkeit - diese konnte ich aber trotz Vergleich HTML Dateien mit funktionierenden Seiten nicht finden.
Ich wäre um eine Lösung dankbar.
Gruß
Rainer
Re: (Bild) Slider funktioniert nicht
Hallo,
diese Slider brauchen teilweise irgendeine More-Komponente.
Außerdem funktionier ein Script für MooTools v1.1x nicht immer mit MooTools V1.2x.
Das hier funktioniert: Bitte beachten: MooTools V1.2x !
Einfacher Bilder-Slider mit Template- und CSS Dateien
Knut
diese Slider brauchen teilweise irgendeine More-Komponente.
Außerdem funktionier ein Script für MooTools v1.1x nicht immer mit MooTools V1.2x.
Das hier funktioniert: Bitte beachten: MooTools V1.2x !
Einfacher Bilder-Slider mit Template- und CSS Dateien
Knut
>> HowTo | DOCU | FAQ | TEMPLATES/DOCS << ( SITE )
-
- Posts: 45
- Joined: Sun 13. Jul 2008, 10:45
Re: (Bild) Slider funktioniert nicht
Hallo flip flop,
danke für die schnelle Antwort. Das Script aus der Wiki hatte ich auch schon getestet - leider auch ohne Erfolg:
http://www.unterwwwegs.de/index.php?testseite#
Deshalb denke ich, das grundsätzlich was nicht stimmt.
Gruß
Rainer
danke für die schnelle Antwort. Das Script aus der Wiki hatte ich auch schon getestet - leider auch ohne Erfolg:
http://www.unterwwwegs.de/index.php?testseite#
Deshalb denke ich, das grundsätzlich was nicht stimmt.
Gruß
Rainer
Re: (Bild) Slider funktioniert nicht
Es fehlt die More Komponente FX.Scoll, sofort ersichtlich im Firebug.
Im Template vor dem Einleitenden [PHP] eintragen:
Knut
Im Template vor dem Einleitenden [PHP] eintragen:
Code: Select all
<!-- JS: MORE:Fx/Fx.Scroll -->
[PHP]
......
......
......
>> HowTo | DOCU | FAQ | TEMPLATES/DOCS << ( SITE )
Re: (Bild) Slider funktioniert nicht
stell mal Mootools 1.1 ein und versuch es noch mal...rbstuttgart wrote:Hallo flip flop,
danke für die schnelle Antwort. Das Script aus der Wiki hatte ich auch schon getestet - leider auch ohne Erfolg:
http://www.unterwwwegs.de/index.php?testseite#
Deshalb denke ich, das grundsätzlich was nicht stimmt.
Gruß
Rainer
( ich hatte das gleiche Problem mit dem Script, kurioser weise läuft es bei mir mit der 1.1 )
viel Erfolg, Rudi
Re: (Bild) Slider funktioniert nicht
Weil du die 1.1 Scriptvariante verwendest. Hier hat das einen anderen Grund. - Warten wir es ab.ich hatte das gleiche Problem mit dem Script, kurioser weise läuft es bei mir mit der 1.1
(Ich würde V1.1 nicht mehr verwenden wenn eben möglich).
Knut
Last edited by flip-flop on Mon 1. Mar 2010, 15:41, edited 1 time in total.
>> HowTo | DOCU | FAQ | TEMPLATES/DOCS << ( SITE )
-
- Posts: 45
- Joined: Sun 13. Jul 2008, 10:45
Re: (Bild) Slider funktioniert nicht
SUUUUPer es funktioniert. Vielen, vielen Dank.
Re: (Bild) Slider funktioniert nicht
Freut mich...
Ich habe das Script für Mootools 1.2 auch ausprobiert, im Backend auf 1.2 eingestellt und eben dieses Problem gehabt.
Jetzt möchte ich ja nur noch wissen ob es an dem Script im Wikki liegt, oder an der Version? Ich habe die "r398" aufgespielt.
Ich habe das Script für Mootools 1.2 auch ausprobiert, im Backend auf 1.2 eingestellt und eben dieses Problem gehabt.
Jetzt möchte ich ja nur noch wissen ob es an dem Script im Wikki liegt, oder an der Version? Ich habe die "r398" aufgespielt.
Re: (Bild) Slider funktioniert nicht
Genau der selbe Grund, für die neueren CMS-Versionen ab r381 fehlt das Hinzulinken des More FX.Scrollers.
(Ist nun behoben).
Knut
(Ist nun behoben).
Knut
>> HowTo | DOCU | FAQ | TEMPLATES/DOCS << ( SITE )
Re: (Bild) Slider funktioniert nicht
Danke für die schnelle Reaktion. Habs schon getestet und es funktioniert!!!
Dann werde ich gleich mal alles auf Mootools 1.2 umstellen.
Rudi
Dann werde ich gleich mal alles auf Mootools 1.2 umstellen.
Rudi
- swisscheese
- Posts: 138
- Joined: Mon 19. Feb 2007, 16:37
- Location: Solothurn, Schweiz
Re: (Bild) Slider funktioniert nicht
Um den Slider noch flexibler zu halten, habe ich mir mal die Mühe gemacht, das Skript etwas anzupassen (Siehe auch diesen alten Thread). Hier ist die angepasste Version für Mootools 1.2 (ab r381).
Vorteile:
- Breite, Höhe und Länge des Sliders richten sich nach den Einstellungen der Bildvorschaugrösse und Spaltenanzahl
- Bei mehreren Slidern auf einer Seite kann man nicht mehr über das Ende hinaus scrollen
Template:
CSS:
Have fun
Gerd
Vorteile:
- Breite, Höhe und Länge des Sliders richten sich nach den Einstellungen der Bildvorschaugrösse und Spaltenanzahl
- Bei mehreren Slidern auf einer Seite kann man nicht mehr über das Ende hinaus scrollen
Template:
Code: Select all
<!--IMAGES_HEADER_START//-->
<div>
[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
[TEXT]{TEXT}[/TEXT]
<div class="outer" style="height:{THUMB_HEIGHT_MAX}px;">
<a href="#" id="move_left_{ID}" class="sliderArrowLft"><img src="picture/site/arrow_10x85_lft_grey.png" width="10" height="{THUMB_HEIGHT_MAX}" alt="" /></a>
<div class="slider" id="slider_container_{ID}" style="height:{THUMB_HEIGHT_MAX}px; width:[PHP]echo ('{THUMB_COLUMNS}' * ('{THUMB_WIDTH_MAX}' + '{SPACE}'))[/PHP]px; left:[PHP]echo ('{SPACE}' + 10)[/PHP]px;">
<div id="slider_{ID}" class="inner">
<!--IMAGES_HEADER_END//-->
<!--IMAGES_ENTRY_START//-->
<p style="width:{THUMB_WIDTH}px; margin-right:{SPACE}px;">
{IMAGE}[CAPTION]<br />{CAPTION}
[/CAPTION]</p>
<!--IMAGES_ENTRY_END//-->
<!--IMAGES_ENTRY_SPACER_START//--><!--IMAGES_ENTRY_SPACER_END//-->
<!--IMAGES_ROW_SPACER_START//--><!--IMAGES_ROW_SPACER_END//-->
<!--IMAGES_FOOTER_START//-->
</div>
</div>
<a href="#" id="move_right_{ID}" class="sliderArrowRgt" style="left:[PHP]echo (10 + '{SPACE}' + '{THUMB_COLUMNS}' * ('{THUMB_WIDTH_MAX}' + '{SPACE}'))[/PHP]px"><img src="picture/site/arrow_10x85_rgt_grey.png" width="10" height="{THUMB_HEIGHT_MAX}" alt="" /></a>
</div>
</div>
<!-- JS: MORE:Fx/Fx.Scroll -->
[PHP]
$GLOBALS['block']['custom_htmlhead']['slider_{ID}'] = ' <script type="text/javascript">
<!--
// 17.04.09 KH: enhanced and patched for mootools V1.2x
window.addEvent(\'domready\', function(){
Fx.Scroll.implement({
scrollTo: function(y, x){
return this.start(y, x);
}
});
var slider_width = 0;
var step = {THUMB_WIDTH_MAX} + {SPACE};
var scroll_x = 0;
var slider_parent = $(\'slider_container_{ID}\').getSize().x;
$$(\'div#slider_container_{ID} img\').each( function(e) {
slider_width += e.getSize().x + {SPACE};
});
var scroll = new Fx.Scroll(\'slider_container_{ID}\', {
wait: false,
duration: 550,
offset: {\'x\': 0, \'y\': 0},
transition: Fx.Transitions.Quad.easeOut
});
scroll.scrollTo(0, 0);
$(\'move_right_{ID}\').addEvent(\'click\', function(event) {
event = new Event(event).stop();
if(slider_width-slider_parent <= scroll_x) {
scroll_x = scroll_x - step;
}
scroll_x = scroll_x + step;
scroll.scrollTo(scroll_x, 0);
});
$(\'move_left_{ID}\').addEvent(\'click\', function(event) {
event = new Event(event).stop();
scroll_x = scroll_x - step;
if(scroll_x < 0) {
scroll_x = 0;
}
scroll.scrollTo(scroll_x, 0);
});
});
//-->
</script>';
[/PHP]
<!--IMAGES_FOOTER_END//-->
Code: Select all
/* SLIDER */
div.outer {
position:relative;
}
div.slider {
margin: 0 0 10px 0;
padding: 0 0 5px 0;
overflow: hidden;
position: absolute;
top:0;
}
.sliderArrowLft,
.sliderArrowRgt {
width:10px;
display:block;
border:1px solid #fff;
position: absolute;
top:0;
}
.sliderArrowLft img,
.sliderArrowRgt img {
border:none;
}
a.sliderArrowLft:hover,
a.sliderArrowRgt:hover {
border:1px solid #c00;
}
div.slider div.inner {
margin: 0;
padding: 0;
list-style: none;
width: 8000px;
position: absolute;
left: 0;
top: 0;
}
div.slider div.inner p {
padding: 0;
float: left;
}
div.slider div.inner a {
float:left;
border: 1px solid #FFFFFF;
padding: 0;
background-color: #000000;
}
div.slider div.inner a:hover {
border: 1px solid #CC3300;
}
div.slider div.inner br {
clear:left
}
div.slider div.inner img {
border: 1px solid #ccc;
}
div.slider div.inner a img {
border: none;
}
/* eof SLIDER */
Gerd
Re: (Bild) Slider funktioniert nicht
Kann ich in die neue Version für motools 1.2 auch wieder 'autoscroll' integrieren?
Rudi
Rudi
- swisscheese
- Posts: 138
- Joined: Mon 19. Feb 2007, 16:37
- Location: Solothurn, Schweiz
Re: (Bild) Slider funktioniert nicht
Hier ist die autoscroll-Version:
Have fun
Gerd
Code: Select all
<!--IMAGES_HEADER_START//-->
<div>
[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
[TEXT]{TEXT}[/TEXT]
<div class="outer" style="height:{THUMB_HEIGHT_MAX}px;">
<a href="#" id="move_left_{ID}" class="sliderArrowLft"><img src="picture/site/arrow_10x85_lft_grey.png" width="10" height="{THUMB_HEIGHT_MAX}" alt="" /></a>
<div class="slider" id="slider_container_{ID}" style="height:{THUMB_HEIGHT_MAX}px; width:[PHP]echo ('{THUMB_COLUMNS}' * ('{THUMB_WIDTH_MAX}' + '{SPACE}'))[/PHP]px; left:[PHP]echo ('{SPACE}' + 10)[/PHP]px;">
<div id="slider_{ID}" class="inner">
<!--IMAGES_HEADER_END//-->
<!--IMAGES_ENTRY_START//-->
<p style="width:{THUMB_WIDTH}px; margin-right:{SPACE}px;">
{IMAGE}[CAPTION]<br />{CAPTION}
[/CAPTION]</p>
<!--IMAGES_ENTRY_END//-->
<!--IMAGES_ENTRY_SPACER_START//--><!--IMAGES_ENTRY_SPACER_END//-->
<!--IMAGES_ROW_SPACER_START//--><!--IMAGES_ROW_SPACER_END//-->
<!--IMAGES_FOOTER_START//-->
</div>
</div>
<a href="#" id="move_right_{ID}" class="sliderArrowRgt" style="left:[PHP]echo (10 + '{SPACE}' + '{THUMB_COLUMNS}' * ('{THUMB_WIDTH_MAX}' + '{SPACE}'))[/PHP]px"><img src="picture/site/arrow_10x85_rgt_grey.png" width="10" height="{THUMB_HEIGHT_MAX}" alt="" /></a>
</div>
</div>
<!-- JS: MORE:Fx/Fx.Scroll -->
[PHP]
$GLOBALS['block']['custom_htmlhead']['slider_{ID}'] = ' <script type="text/javascript">
<!--
// 17.04.09 KH: enhanced and patched for mootools V1.2x
window.addEvent(\'domready\', function(){
Fx.Scroll.implement({
scrollTo: function(y, x){
return this.start(y, x);
}
});
var manualscroll_speed = 500;
var autoscroll_speed = 4000;
var slider_width = 0;
var step = {THUMB_WIDTH_MAX} + {SPACE};
var scroll_x = 0;
var slider_parent = $(\'slider_container_{ID}\').getSize().x;
var myTimer = false;
var direction = 1;
$$(\'div#slider_container_{ID} img\').each( function(e) {
slider_width += e.getSize().x + {SPACE};
});
var scroll = new Fx.Scroll(\'slider_container_{ID}\', {
link: \'chain\',
duration: manualscroll_speed,
offset: {\'x\': 0, \'y\': 0},
transition: Fx.Transitions.Quad.easeInOut
});
var autoscroll = new Fx.Scroll(\'slider_container_{ID}\', {
wait: false,
duration: autoscroll_speed,
offset: {\'x\': 0, \'y\': 0},
transition: Fx.Transitions.linear
});
scroll.scrollTo(0, 0);
$(\'move_right_{ID}\').addEvent(\'click\', function(event) {
myTimer = $clear(myTimer);
autoscroll.stopTimer();
event = new Event(event).stop();
scroll_x = scroll_x + step;
if(slider_width-slider_parent <= scroll_x) {
scroll_x = scroll_x - step;
}
scroll.scrollTo(scroll_x, 0);
myTimer = automove_right_{ID}.periodical(autoscroll_speed);
});
$(\'move_left_{ID}\').addEvent(\'click\', function(event) {
myTimer = $clear(myTimer);
autoscroll.stopTimer();
event = new Event(event).stop();
scroll_x = scroll_x - step;
if(scroll_x < 0) {
scroll_x = 0;
}
scroll.scrollTo(scroll_x, 0);
myTimer = automove_right_{ID}.periodical(autoscroll_speed);
});
function automove_right_{ID}() {
if(slider_width-slider_parent <= scroll_x + step) {
direction = -1;
}
if(scroll_x <= 0) {
direction = 1;
}
scroll_x = scroll_x + step * direction;
autoscroll.scrollTo(scroll_x, 0);
}
myTimer = automove_right_{ID}.periodical(autoscroll_speed);
});
//-->
</script>';
[/PHP]
<!--IMAGES_FOOTER_END//-->
Gerd
Re: (Bild) Slider funktioniert nicht
dann sag ich mal schnell: danke habs schon mal eingebaut und es läuft...
war bei Dir ja auch nicht anders zu erwarten
Rudi
war bei Dir ja auch nicht anders zu erwarten
Rudi
Re: (Bild) Slider funktioniert nicht
Ja, stimmt - habe auch gerade gegrübelt und nicht im Board gesucht! Dann fand ich im aktuellen Teil diesen Thread - fein gemacht - bei mir läuft das Teil auch wieder .
Lieber arm dran als Arm ab!
meine historische Website: Jagdgeschwader 300 1.9.34-R554
kukki's SpIeLwIeSe V.1.9.33 R553 responsive
meine historische Website: Jagdgeschwader 300 1.9.34-R554
kukki's SpIeLwIeSe V.1.9.33 R553 responsive