Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
123456
Threadersteller
Dabei seit: 15.01.2006
Ort: Dresden
Alter: -
Geschlecht:
|
Verfasst Di 19.10.2010 23:04
Titel Allgemeine Mootools Core More Frage |
|
|
Hallo,
leider habe ich von JS nicht allzuviel Ahnung und Mootools dementsprechend das gleiche.
Ich benötige bei Mootools fx.scroll die getsize() und scrollto() funktionen. Möchte erst Fensterbreite auslesen und dann genau einmal diese Breite scrollen.
Nun sagter mir in der Firefox Fehlerkonsole immer "getsize() is not a function" ...das gleiche bei scrollto().
Für eine andere Mootools Funktion brauch ich die More Bibliothek. Also hab ich Core und More eingebunden. Übrigens funktionieren ja andere Scrollfunktionen wie "toLeft()" oder "toElement" wunderbar.
Warum aber die anderen beiden nicht? Hat das was mit More/Core zu tun?
Zitat: | window.addEvent('domready', function(){
var myTransition = new Fx.Transition(Fx.Transitions.Quint, 3);
var scroll = new Fx.Scroll(window, {
wait: false,
duration: 800,
offset: {'x': 000, 'y': 0},
transition: myTransition.easeInOut
})
$('Stest').addEvent('click', function(event) {
event = new Event(event).stop();
scrollmiddle.toElement('test');
});
$('arrowleft').addEvent('click', function(event) {
event = new Event(event).stop();
var size = scroll.getSize();
alert(size.x);
});
});
Danke! |
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 20.10.2010 07:31
Titel
|
|
|
Moin,
es sind nur ein paar kleinere Fehler in deinem Script.
Es wird z.B. nirgends ein 'scrollmiddle' definiert:
Code: | $('Stest').addEvent('click', function(event) {
event = new Event(event).stop();
scrollmiddle.toElement('test');
}); |
Ich schätze du willst hier auf deinen Scrolleffekt zugreifen,
sieht dann so aus (wie auch immer dein html selbst aussieht):
Code: | $('Stest').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('test');
}); |
Hier versuchst Du die Size des Scrolleffekts auszulesen,
die aber keine hat.
Code: | $('arrowleft').addEvent('click', function(event) {
event = new Event(event).stop();
var size = scroll.getSize();
alert(size.x);
}); |
Wenn du die Breite des Fensters haben willst, könntest
Du schreiben:
Code: | $('arrowleft').addEvent('click', function(event) {
event = new Event(event).stop();
var size = window.getSize();
alert(size.x);
}); |
Das ist dann aber die Breite des Fensters, inkl. Scrollbar,
Rändern etc pp. Wenn Du die Client-Width haben willst,
könntest Du es auch so schreiben:
Code: | $('arrowleft').addEvent('click', function(event) {
event = new Event(event).stop();
alert(document.body.getSize().x);
}); |
Ich hoffe Verwirrung gestiftet zu haben.
Grüße
zweitaccount
Zuletzt bearbeitet von zweitaccount am Mi 20.10.2010 07:33, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
123456
Threadersteller
Dabei seit: 15.01.2006
Ort: Dresden
Alter: -
Geschlecht:
|
Verfasst Mi 20.10.2010 09:52
Titel
|
|
|
Hey, Danke Dir!
Das scrollmiddle war noch aus einem Test drin, sry Das "toElement" funktionierte ja ansonsten
Das herausfinden der Breiten ist sehr hilfreich!
Ehrlich gesagt, ich hab ja bei new Fx.scroll "window" angegeben..daher dachte ich, dass er darauf getsize bezieht.
Aber das verstehe ich nun, dank deiner Erläuterung.
Nur warum funktionierte da "scroll.scrollto(300,0)" zum Beispiel nicht? Da kam ja auch die Meldung "scrollto is not a function"
|
|
|
|
|
immerIch
Dabei seit: 19.10.2010
Ort: #mein{display:block}
Alter: 35
Geschlecht:
|
Verfasst Mi 20.10.2010 12:05
Titel
|
|
|
kann es sein dass es anstatt scrollto scrollTo heißen muss?
|
|
|
|
|
123456
Threadersteller
Dabei seit: 15.01.2006
Ort: Dresden
Alter: -
Geschlecht:
|
Verfasst Mi 20.10.2010 18:56
Titel
|
|
|
Groß-Kleinschreibung hab ich schon beachtet im Code - nur hier im FOrum etwas vernachlässigt
Ich denke es hat irgendwie mit dem Core und More zu tun, oder?
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 20.10.2010 21:25
Titel
|
|
|
Hi,
also scrollTo erwartet eine Id oder eine Referenz auf ein Element
(also z.B. scroll.toElement('id-des-elements-zu-dem-gescrollt-werden-soll'));
Wenn du x/y-Positionen angeben willst, müsstes Du das
mit scroll.start(x-Cord, y-Cord); machen...
Wobei das mit window wohl nicht so einfach geht.
Grüße
zweitaccount
// edith - wenn dus aufs window beziehst müsste body auch die
position 'bereitstellen'. Also praktisch so:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MooScroll</title>
<style type="text/css">
body {
margin:0;
padding:0;
width:2000px;
height:2000px;
overflow:hidden;
}
#area {
position:absolute;
top:200px;
left:200px;
width:200px;
height:200px;
background:red;
}
</style>
<script type="text/javascript" src="mootools-core-1.3.js"></script>
<script type="text/javascript" src="mootools-1.2.4.4-more.js"></script>
<script type="application/javascript">
window.addEvent('domready', function(){
var myTransition = new Fx.Transition(Fx.Transitions.Quint, 3);
var scroll = new Fx.Scroll(window, {
wait: false,
duration: 800,
offset: {'x': 000, 'y': 0},
transition: myTransition.easeInOut
})
$('test').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.start(1400,800);
});
});
</script>
</head>
<body>
<div id="area" style="width:1000px;height:1000px">
<a href="#" id="test">Start</a>
</div>
</body>
</html>
|
Zuletzt bearbeitet von zweitaccount am Mi 20.10.2010 21:33, insgesamt 1-mal bearbeitet
|
|
|
|
|
123456
Threadersteller
Dabei seit: 15.01.2006
Ort: Dresden
Alter: -
Geschlecht:
|
Verfasst Do 21.10.2010 16:46
Titel
|
|
|
Danke für deine Mühe! Kommt schon imemr mehr Licht ins Dunkel...
Mal kurz meine Erklärung was ich vorhab.
Per Fixed Position hab ich am linken und rechten Fensterrand jeweils einen Pfeil. Klickt man drauf, soll in die jeweilige Richtung die Fensterbreite gescrollt werden. Also so wie wenn man auf der Tastatur auf "Bild hoch" drückt...nur eben nach links und rechts
Hab nun folgenden Code, welcher in FF, IE und Opera läuft, jedoch nicht in Chrome und Safari
(sry für die schlechte Codeformatierung)
Code: | $('arrowleft').addEvent('click', function(event) {
event = new Event(event).stop();
var size = window.getSize(); //Bildschirmbreite
var leftpos = document.documentElement.scrollLeft; //Bilschirmposition links
var toppos = document.documentElement.scrollTop;
scroll.start((leftpos)-(size.x), toppos);
});
$('arrowright').addEvent('click', function(event) {
event = new Event(event).stop();
var size = window.getSize();
var leftpos = document.documentElement.scrollLeft;
var toppos = document.documentElement.scrollTop;
scroll.start((leftpos)+(size.x), toppos);
}); |
Chrome und Safari mögen wohl nicht die scrolleft und scrolltop Eigenschaften. Gibts da noch was anderes?
EDIT: document.body.scrollLeft und document.body.scrollTop gerade entdeckt. Die Beiden funktionieren aber NUR in Chrome und Safari
Wie löst man das Problem am besten?
Zuletzt bearbeitet von 123456 am Do 21.10.2010 16:58, insgesamt 2-mal bearbeitet
|
|
|
|
|
123456
Threadersteller
Dabei seit: 15.01.2006
Ort: Dresden
Alter: -
Geschlecht:
|
Verfasst Do 21.10.2010 19:56
Titel
|
|
|
OK habs selbst hinbekommen.
Danke nochmal für die Hilfe!
Hier noch ein interessanter Link, falls mal jemand ein ähnliches Problem mit Safari und Chrome hat: klick mich
|
|
|
|
|
|
|
|
Ähnliche Themen |
allgemeine Frage zu Apps
Allgemeine Frage zu Javascript
allgemeine Frage zum Seitenaufbau
Allgemeine Frage zu Photoshop-Layout für CMS
Allgemeine Frage zu Flash Film
iCarousel (allgemeine Javascript Frage)
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum nicht antworten. Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|