Поиск по этому блогу

суббота, 27 февраля 2016 г.

Пробуем плагины JQuery ...поскольку еще ничего не знаем про twitter bootstrap

Эти строки я пишу через три месяца (публикую старый пост, не пропадать же плагинам). Здесь плагины с сайтов jQuery. Когда я их скачивал, то заметил некое "запустение", но не смог его объяснить... Я тогда "привинтил" к сайту заказчика парочку плагинов..., а сегодня (апрель) использовал бы Bootstrap или Foundation

Scroll inside of a fixed sidebar
service.rmlmenu.jquery is a jQuery plugin that offers a Responsive Multi-Level Menu. Using appropriate device queries in CSS it presents itself as a traditional multi-level dropdown menu on wide screens and as a popup menu on smaller screens.
A tutorial for service.rmlmenu.jquery - Responsive Multi-Level Menu November 14, 2014


Simple Sliding Sidebar Panels with jQuery - Sidebar Sidebar is a simple lightweight jQuery plugin to create vertical or horizontal sidebars sliding out form any edge of your browser screen. Ideal for mobile app-style togglable sidebar menu to improve the content readability on small screen devices.
Demo Toggle Right Toggle Bottom


Minimal Drawer Sidebar Plugin with jQuery - Sidebar.js Sidebar.js is an ultra-light jQuery plugin used to create a tabbed drawer sidebar that slides out from the edge of the screen on mouse hover. Great for sliding contact or feedback forms.
Demo jQuery Sidebar.js Demo Page


Vertical Fixed Navigation #2 A smart vertical navigation, with round indicators that turn into labelled icons when the user interacts with them.
Demo
jQuery toggle Method
Toggle between hide and show

Попробуем, как это рабтает здесь

In [ ]:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
In [8]:
%%html

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("p").toggle(1000);
    });
});
</script>


<p>This is a paragraph.</p>

<button>Toggle between hide() and show()</button>

This is a paragraph.

The toggle() method toggles between hide() and show() for the selected elements.

This method checks the selected elements for visibility. show() is run if an element is hidden. hide() is run if an element is visible - This creates a toggle effect.

Note: Hidden elements will not be displayed at all (no longer affects the layout of the page).

Tip: This method can also be used to toggle between custom functions.

In [ ]:
$(selector).toggle(speed,easing,callback)

speed Optional. Specifies the speed of the hide/show effect Possible values: •milliseconds •"slow" •"fast"

easing Optional. Specifies the speed of the element in different points of the animation. Default value is "swing" Possible values: •"swing" - moves slower at the beginning/end, but faster in the middle •"linear" - moves in a constant speed Tip: More easing functions are available in external plugins

callback Optional. A function to be executed after the toggle() method is completed To learn more about callback, visit our jQuery Callback chapter

In [11]:
%%html
<script>
$(document).ready(function(){
    $("button.0").click(function(){
        $("p.1").toggle(2000, function(){
            alert("The toggle() method is finished!");
        });
    });
});
</script>


<p class="1">This is a paragraph.</p>

<button class="0">Toggle between hide() and show()</button>

This is a paragraph.

In [14]:
%%html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script> 
$(document).ready(function(){
    $("button.1").click(function(){
        $("div").animate({
            height: 'toggle'
        });
    });
});
</script> 

<p>Click the button multiple times to toggle the animation.</p>

<button class="1" >Start Animation</button>

<p>By default, all HTML elements have a static position, and cannot be moved. 
To manipulate the position, remember to first 
set the CSS position property of the element to relative, fixed, or absolute!</p>

<div style="background:#98bf21;height:100px;width:100px;position:relative;"></div>

Click the button multiple times to toggle the animation.

By default, all HTML elements have a static position, and cannot be moved. To manipulate the position, remember to first set the CSS position property of the element to relative, fixed, or absolute!

In [ ]:
#aside {
    position: fixed;
    width: 250px;
    overflow-y: scroll;
    top: 0;
    bottom: 0;
}
In [6]:
!dir ..\..\..\stradorusite\plugins
 ’®¬ ў гбва®©б⢥ F Ё¬ҐҐв ¬ҐвЄг MYLINUXLIVE
 ‘ҐаЁ©­л© ­®¬Ґа ⮬ : CE7F-8134

 ‘®¤Ґа¦Ё¬®Ґ Ї ЇЄЁ F:\stradorusite\plugins

15.12.2015  19:59    <DIR>          .
15.12.2015  19:59    <DIR>          ..
09.12.2015  22:34            20я494 CHANGELOG.txt
15.12.2015  20:08    <DIR>          language
09.12.2015  22:34                 0 nonumberinstaller.php
09.12.2015  22:34               736 nonumberinstaller.xml
15.12.2015  20:08    <DIR>          packages
09.12.2015  22:34             5я154 script.install.php
16.12.2015  14:58            67я290 add-custom-css.zip
10.05.2014  12:12    <DIR>          Joomla 2.5, 3.0 Module
10.05.2014  12:06    <DIR>          Joomla 2.5, 3.0 Plugin
15.12.2014  03:55    <DIR>          jPlayer-2.9.2
18.05.2015  23:16    <DIR>          icheck-1.x
24.01.2016  04:58    <DIR>          slick-master
03.07.2014  17:18    <DIR>          timmywil-jquery.panzoom-8b4b824
29.06.2015  13:36    <DIR>          elevatezoom-master
02.06.2015  06:32    <DIR>          soundmanagerv297a-20150601
25.01.2016  18:21    <DIR>          gos-smetaru
05.04.2013  10:52    <DIR>          jQuery-Plugin-For-Sliding-Sidebar-Menu-jQuery-Sidebar
07.09.2014  20:47    <DIR>          layout-master
07.01.2016  12:05    <DIR>          vertical-fixed-navigation-2
07.01.2016  12:12    <DIR>          __MACOSX
17.09.2015  05:44    <DIR>          Simple-Sliding-Sidebar-Panels-with-jQuery-Sidebar
               5 д ©«®ў         93я674 Ў ©в
              18 Ї Ї®Є   4я167я163я904 Ў ©в бў®Ў®¤­®


Посты чуть ниже также могут вас заинтересовать

Комментариев нет: