Treelist - jQuery plugin
Update: დაემატა expandAll() და collapseAll() ფუნქციები. ასევე აქტიური ელემენტის დამახსოვრება გვერდის განახლების დროს.
სინამდვილეში ამას პლაგინი მარტო იმის გამო ქვია, რომ ძალიან მინდოდა პლაგინის დაწერა :))) პატარაა და თან მისი მსგავსები ძალიან ბევრია ინტერნეტში სხვადასხვა ფერის და გემოსი.
პლაგინის დანიშნულება ასაკეცი/ჩამოსაშლელი მენიუს შექმნაა. უფრო სწორად, არსებულ ქვეპუნქტებიან ლისტს აკეცვა/ჩამოშლის შესაძლებლობას აძლევს.
გამოყენების ინსტრუქცია:
1. სკრიპტი ჩავამატოთ საიტზე, ხოლო სკრიპტამდე ჩავამატოთ თვითონ jQuery-ის სკრიპტი. მაგალითად:
<script src="js/jquery.js" type="text/javascript"></script> <script src="js/jquery.treelist.js" type="text/javascript"></script>
2. Tip: jQuery-ის ჩამატებისას შეგიძლიათ თქვენს სერვერზე არსებული ფაილის მაგივრად Google-ის ჰოსტზე განთავსებული ფაილი აიღოთ. ბევრი მომხმარებლის ბრაუზერში უკვე არის მისი კეშირებული ვარიანტი და ჩატვირთვა აღარ დასჭირდება:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/ jquery.min.js" type="text/javascript"></script>
3. თვითონ საიტზე კი, სადაც სიაა, ჩავამატოთ ჯავასკრიპტი.
$('#tree').treelist();
ამ მაგალითში tree სიის ძირეული <ul> ელემენტის id-ია.
1.3.0 ვერსიაში დამატებით არის ორი ფუნქცია. expandAll ყველაფერს ჩამოშლის, ხოლო collapseAll ყველაფერს აკეცავს.
$('#tree').expandAll();
$('#tree').collapseAll();
თუ გვინდა რომ გვერდის განახლების შემდეგ რომელიმე პუნქტი ჩამოშლილი დარჩეს, მაშინ სიის შესაბამის <li> ელემენტს უნდა მივანიჭოთ ”active” კლასი. “active” არის default-ად. კლასის სხვა სახელის შემთხვევაში, treelist() ფუნქციას პარამეტრად უნდა გადასცეთ კლასის სახელი.
შესაძლო პარამეტრები: active, show_speed, hide_speed.
პარამეტრების გადაცემების მაგალითი:
$('#tree').treelist({show_speed:200,
active:'active_item'
});
გადმოწერა:
jquery.treelist-1.3.0.js 09-08-2009
jquery.treelist-1.0.0.js 02-07-2009
პ.ს. ვცადე IE 6+, Mozilla FireFox, Chrome ბრაუზერებში.. სკრიპტის წარმადობას ვერ ვამოწმებ, მაგრამ თუ გავაუმჯობესე და დავაოპტიმიზირე, ახალ ვერსიასაც ავტვირთავ.
Tags: jQuery, plugin, treelist, ჩამოსაშლელი სია


July 2nd, 2009 at 10:57 pm
მშვენიერია, მაგრამ ერთი ბაგი აქვს: რომელიმე იტემის გასწვრივ რომ დააწკაპუნო სადმე ცარიელ ადგილზე მაინც ჩამოიშლება/აიკეცება ხე.
ამას იმ პროექტში ვნახავ რომელშიც მგონია? (happy)
July 2nd, 2009 at 11:02 pm
ოღონდ ბაგი არ არის. სიგანე არ მივუთითე სიას და მთელ გვერდზე გაიშალა.
ანუ ტექსტზე კი არ მოქმედებს აკეცვა/ჩამოკეცვა, არამედ თვითონ სიის მთელ ელემენტზე.
იმ პროექტში იმის ადგილას ჩავანაცვლებ
ის ცოტა გრძელი გზა გამოვიდა.
July 27th, 2009 at 2:45 am
არ გინდა ამ მენიუს სკრიპტზე აწყობილი პლაგინი დაწერო ვორდპრესისთვის რომელიც არქივებს მოასწესრიგებს? :უსერ:
August 4th, 2009 at 1:35 am
საყვარლობაა :))
ახლა .expandAll() და .collapseAll() მეთოდებიც დაუმატე და ეგაა
ასევე, ჩატვირთვის დროს .is(”.active”) ტიპი რომ ავტომატურად გაიშალოს
August 4th, 2009 at 12:58 pm
@Sweet Baby Girl
საინტერესო იდეაა. ცოტა დროს რომ გამოვნახავ, ვიფიქრებ როგორ შეიძლება გაკეთდეს
@Rocko
აუცილებელიცაა..
მაგ შესაძლებლობებს დავამატებ
October 21st, 2009 at 11:06 am
როგორ მინდა ასეთი რამეები ვისწავლო… ზაფხულში უნდა ჩავუჯდე!