[TYPO3-german] Probleme mit JS in Verbindung mit jQuery
Björn Hahnefeld
bh at mp-telekommunikation.de
Fri Oct 26 16:23:01 CEST 2012
Hallo Stefan,
da hast du recht. Das habe ich auch gerade gesehen. Allerdings wird das alles in dem Snippet erledigt:
--
$list.wrap('<div class="spyWrapper2" />').parent().css({ height : height * limit });
--
Wenn ich den Wert ändere, haben wir wieder zwei ineinander verschachtelte Klassen, die dann z.b. spyWrapper2 lauten. Mein TYPO3-Snippet sieht wie folgt aus:
--
5 = HTML
5 {
value (
<script type="text/javascript"> $(function () {
$('ul.spy').simpleSpy();
});
(function ($) {
$.fn.simpleSpy = function (limit, interval) {
limit = limit || 1;
interval = interval || 6000;
return this.each(function () {
// 1. setup
// capture a cache of all the list items
// chomp the list down to limit li elements
var $list = $(this),
items = [], // uninitialised
currentItem = limit,
total = 0, // initialise later on
height = $list.find('> li:first').height();
// capture the cache
$list.find('> li').each(function () {
items.push('<li>' + $(this).html() + '</li>');
});
total = items.length;
$list.wrap('<div class="spyWrapper2" />').parent().css({ height : height * limit });
$list.find('> li').filter(':gt(' + (limit - 1) + ')').remove();
// 2. effect
function spy() {
// insert a new item with opacity and height of zero
var $insert = $(items[currentItem]).css({
height : 0,
opacity : 0
}).prependTo($list);
// fade the LAST item out
$list.find('> li:last').animate({ opacity : 0}, 1000, function () {
// increase the height of the NEW first item
$insert.animate({ height : height }, 1000).animate({ opacity : 1 }, 1000);
// AND at the same time - decrease the height of the LAST item
// $(this).animate({ height : 0 }, 1000, function () {
// finally fade the first item in (and we can remove the last)
$(this).remove();
// });
});
currentItem++;
if (currentItem >= total) {
}
else {
// currentItem = 0;
setTimeout(spy, interval)
}
}
spy();
});
};
})(jQuery);
</script>
)
}
--
Viele Grüße
björn
-----Ursprüngliche Nachricht-----
Von: typo3-german-bounces at lists.typo3.org [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von Stefan Reichelt
Gesendet: Freitag, 26. Oktober 2012 16:13
An: German TYPO3 Userlist
Betreff: Re: [TYPO3-german] Probleme mit JS in Verbindung mit jQuery
Hallo Björn,
stimmt, aber zumindest tut das Skript funktionieren und auch die Eintraege aendern sich schon mal.
So sieht das HTML dort aber aus:
--
<divclass="spyWrapper"style="height: 36px;">
<divclass="spyWrapper"style="height: 0px;"> <ulclass="spy"> ....
</ul>
</div>
</div>
--
Das <div> mit der Klasse spyWrapper ist einmal zu viel.
Wenn ich im FireBug die Hoehe des zweiten DIVs auf 36px setze und die margin von spyWrapper auf '5px 0 0 -10px' (also die Haelfte vom momentanen), dann funktioniert es.
Das zweite spyWrapper ist halt zuviel. Ohne sollte es auch so funktionieren.
Hier die Zeile die den spyWrapper erzeugt:
$list.wrap('<div class="spyWrapper" />').parent().css({ height : height
* limit });
Leider weiss ich aber nicht warum es das zweimal erzeugt, da kenn ich mich leider nicht gut genug damit aus...
Beste Gruesse
Stefan
On 26/10/2012 15:30, Björn Hahnefeld wrote:
> Hallo Stefan,
>
> sehr schön, dass du dich der Sache annimmst. Ich habe die drei Kommentare soeben entfernt. Leider aber hat sich - was die Darstellung betrifft - leider nicht viel verändert. Woran könnte es denn noch liegen?
>
> Viele Grüße
>
> björn
>
> -----Ursprüngliche Nachricht-----
> Von: typo3-german-bounces at lists.typo3.org
> [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von Stefan
> Reichelt
> Gesendet: Freitag, 26. Oktober 2012 15:28
> An: German TYPO3 Userlist
> Betreff: Re: [TYPO3-german] Probleme mit JS in Verbindung mit jQuery
>
> Hallo Björn,
>
> in deinem Seitenskript in der Funktion spy() (die das animieren macht) sind folgende drei Codezeilen auskommentiert:
> --
>
> // $(this).animate({ height : 0 }, 1000, function () {
>
> // });
>
> //currentItem = 0;
>
> --
>
> Soll das so sein? Ich bin mir da nicht sicher. Soweit ich das Skript verstehe sind die jeweiligen Zeilen notwendig?
>
> Beste Gruesse
> Stefan
>
>
> On 26/10/2012 13:24, Björn Hahnefeld wrote:
>> Wenn ich die SexyBookmarks beispielsweise deaktiviere, ändert sich rein gar nichts. Aber vermutlich ist es ein Syntax-Fehler?
>>
>> http://validator.w3.org/check?uri=http%3A%2F%2Fmp.df-kunde.de%2F_test
>> s
>> ystem%2Findex.php%3Fid%3D4&charset=%28detect+automatically%29&doctype
>> =
>> Inline&group=0&user-agent=W3C_Validator%2F1.3
>>
>> -----Ursprüngliche Nachricht-----
>> Von: typo3-german-bounces at lists.typo3.org
>> [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von Jost
>> Baron
>> Gesendet: Freitag, 26. Oktober 2012 11:40
>> An: typo3-german at lists.typo3.org
>> Betreff: Re: [TYPO3-german] Probleme mit JS in Verbindung mit jQuery
>>
>> -----BEGIN PGP SIGNED MESSAGE-----
>> Hash: SHA1
>>
>> Hi Björn,
>>
>> von jQuery. jQuery muss vor allem, was jQuery nutzt, eingebunden werden. Insbesondere also vor sexybookmarks.js.
>>
>> Um das zu erreichen, könntest du die Extension t3jquery nutzen, oder folgendes TS:
>>
>> page.includeJSlibs.jQuery =
>> https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
>> page.includeJSlibs.jQuery.external = 1
>>
>> Viele Grüße,
>> Jost
>>
>>
>> On 10/26/2012 11:28 AM, Björn Hahnefeld wrote:
>>> Von welcher Bibliothek redest du denn, David?
>>>
>>> -----Ursprüngliche Nachricht----- Von:
>>> typo3-german-bounces at lists.typo3.org
>>> [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von David
>>> Gurk Gesendet: Freitag, 26. Oktober 2012 10:20 An: German TYPO3
>>> Userlist Betreff: Re: [TYPO3-german] Probleme mit JS in Verbindung
>>> mit jQuery
>>>
>>> Ich muss dass doch revidieren. Es stimmt schlichtweg die Reihenfolge
>>> nicht. Die Bibliothek muss natürlich an erste Stelle vor allen
>>> jQuery-Plugins eingebunden werden.
>>>
>>> -----Ursprüngliche Nachricht----- Von:
>>> typo3-german-bounces at lists.typo3.org
>>> [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von David
>>> Gurk Gesendet: Freitag, 26. Oktober 2012 10:18 An: German TYPO3
>>> Userlist Betreff: Re: [TYPO3-german] Probleme mit JS in Verbindung
>>> mit jQuery
>>>
>>> In der Firebug Konsole kommt die Fehlermeldung "jQuery is not
>>> defined
>>> (index.php?id=4 (Zeile 34))". Also im Header ist die
>>> jQuery-Bibliothek nicht zu finden.
>>>
>>> -----Ursprüngliche Nachricht----- Von:
>>> typo3-german-bounces at lists.typo3.org
>>> [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von Björn
>>> Hahnefeld Gesendet: Freitag, 26. Oktober 2012 10:13 An:
>>> typo3-german at lists.typo3.org Betreff: [TYPO3-german] Probleme mit JS
>>> in Verbindung mit jQuery
>>>
>>> Guten Morgen,
>>>
>>>
>>>
>>> auf einer Webseite habe ich jQuery eingesetzt und möchte meine News
>>> einblenden. Vor kurzem hat das schon mal funktioniert. Mittlerweile
>>> geht das aber nicht mehr. Daher vermute ich, dass es ein kleiner
>>> Fehler sein muss, In der Fehlerkonsole hingegen wird aber nichts
>>> ausgegeben, weswegen ich ein bisschen ratlos bin. Es geht um diese
>>> Webseite hier: http://mp.df-kunde.de/_testsystem/index.php?id=4.
>>>
>>>
>>>
>>> Wer kann sich der Sache annehmen und mir ggf. helfen?
>>>
>>>
>>>
>>> Besten Dank und viele Grüße
>>>
>>>
>>>
>>> Björn
>>>
>>> _______________________________________________ TYPO3-german mailing
>>> list TYPO3-german at lists.typo3.org
>>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>>>
>>>
>>> _______________________________________________ TYPO3-german mailing
>>> list TYPO3-german at lists.typo3.org
>>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>>>
>>>
>>> _______________________________________________ TYPO3-german mailing
>>> list TYPO3-german at lists.typo3.org
>>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>>> _______________________________________________ TYPO3-german mailing
>>> list TYPO3-german at lists.typo3.org
>>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>>>
>> -----BEGIN PGP SIGNATURE-----
>> Version: GnuPG v1.4.11 (GNU/Linux)
>> Comment: Using GnuPG with Mozilla - http://www.enigmail.net/
>>
>> iQIcBAEBAgAGBQJQilp/AAoJEG6HPMAgWtVz9rkQAIBdqRK9jO9jygoTTUU24RqP
>> NrsSAe/EX0+tIfBZypIJ//JFN69NYXTB4WrENzkNnNSNTglPRqYJEipc9oGWXMqf
>> 8Wd6jfdnZ5K/SgfH1IioVFretsnRTXqymhPQoCLxmVsfuddf3CDDBhaBN1N4NZbD
>> Osc73ClodsLTsruKW3txSan3I3dlQoEucvMmrjNPcZ80MkB1LQyio3fN1kO8FiEJ
>> G8gGIXI1eK5I7DEixxdENZAlzIx6JzR8UxV+UcCN+iJolnGAj0ASTIAYZQLkiUL5
>> Wrg3UPKC/eib5zBLOHiQwd23PmIamGXLhXBc9emhzjlaohiPUhQs9alB3//XDWhB
>> IaIyhGIk1D8MYS5QWR0kU3O4oSLV13yLX25YA98ws8AVpnFkiAGcwrRaxItuNCK3
>> NOMhL48Bm4oo42llpWX26mKsAfUtc0dJzzR9bChf34WcKdYBsFNaVp2K0XDK8Bf7
>> hFrDfL3nHUcD66UMoALwZuLGKUI2BCoNdFAQHFFwQdLiraP1688V9cHR9XI229n/
>> 4L+zVqSht4YnJUQbDpmDfPxOpjCy00hHK19LTtJEP47aUdQ+oGbQW7/3/I3R619Z
>> n4EywEbKfjtEfzzqgTYVB59rDNnZKq4J95HAAIL4lx7Lw9jed6uGZjjHP83Nolgy
>> q16k1A9WPS+Jy0877pzS
>> =gdWw
>> -----END PGP SIGNATURE-----
>> _______________________________________________
>> TYPO3-german mailing list
>> TYPO3-german at lists.typo3.org
>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>> _______________________________________________
>> TYPO3-german mailing list
>> TYPO3-german at lists.typo3.org
>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>>
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
>
_______________________________________________
TYPO3-german mailing list
TYPO3-german at lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
More information about the TYPO3-german
mailing list