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 ბრაუზერებში.. სკრიპტის წარმადობას ვერ ვამოწმებ, მაგრამ თუ გავაუმჯობესე და დავაოპტიმიზირე, ახალ ვერსიასაც ავტვირთავ.