Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
Другие темы раздела
jQuery Отладка взимодействия JS+JQ-DATEPICKER+RADIO BUTTON http://www.cyberforum.ru/javascript-jquery/thread1065918.html
Здравствуйте, уважаемые. Я к сожалению не обладаю достаточными познаниями в JS, поэтому прошу помощи у более опытных людей. Сначала расскажу что я хочу и зачем, а потом приведу свой Г-код) Я...
jQuery Как сделать чтобы менялся url при jquery ajax запросе? Есть меню c кнопками имеющими класс .btn и див(.field) с основным содержимым. Задача сделать так, чтобы при клике по кнопкам меню происходило обновление только в диве (.field). Я это сделал... http://www.cyberforum.ru/javascript-jquery/thread1065753.html
jQuery jquery и мультисписок select multiple
как, с помощью jquery получить все выбранные элементы из мульти <select> ? .value получает только последний нажатый(
jQuery Эффект включения телевизора
Добрый день. Подскажите пожалуйста, как это возможно реализовать... На странице есть изображение телевизора, как страница загрузилась на экране телевизора должны появиться помехи, потом они...
jQuery Как в FancyBox реализовать элементы управления, и как им назначить соответствующие картинки http://www.cyberforum.ru/javascript-jquery/thread1065640.html
Всем доброго времени суток. Подскажите пожалуйста опытные кодеры, как в фенсибоксе реализовать элементы управления, и как к ним прилепить соответствующие картинки. Я не давно начал изучать...
jQuery Слайдер новостей\картинок Здрасте, помогите создать слайдер как на www.hulu.com, такой как под постером там где 1я на всю высоту , а далее 2 колонки. Разметку сделал , коди немогу написать. Помогите пож. Спасибо подробнее
pekinessik
0 / 0 / 0
Регистрация: 14.09.2009
Сообщений: 44
0

Статическая панель

08.01.2014, 22:13. Просмотров 491. Ответов 8
Метки (Все метки)

Всем привет. Столкнулся с такой проблемой (уже сутки кручу ее): есть читалка, которая перелистывает листы книги. При нажатии на иконку списка выезжает панель с заголовками страниц, по клику на которые книжка переворачивается на нужную страницу, а панель закрывается. Мне надо сделать так, чтобы панель все время была видна.

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
var Page = (function() {
 
    var $container = $( '#container' ),
        $bookBlock = $( '#bb-bookblock' ),
        $items = $bookBlock.children(),
        itemsCount = $items.length,
        current = 0,
        bb = $( '#bb-bookblock' ).bookblock( {
            speed : 800,
            perspective : 2000,
            shadowSides : 0.8,
            shadowFlip  : 0.4,
            onEndFlip : function(old, page, isLimit) {
                
                current = page;
                // update TOC current
                updateTOC();
                // updateNavigation
                updateNavigation( isLimit );
                // initialize jScrollPane on the content div for the new item
                setJSP( 'init' );
                // destroy jScrollPane on the content div for the old item
                setJSP( 'destroy', old );
 
            }
        } ),
        $navNext = $( '#bb-nav-next' ),
        $navPrev = $( '#bb-nav-prev' ).hide(),
        $menuItems = $container.find( 'ul.menu-toc > li' ),
        $tblcontents = $( '#tblcontents' ),
        transEndEventNames = {
            'WebkitTransition': 'webkitTransitionEnd',
            'MozTransition': 'transitionend',
            'OTransition': 'oTransitionEnd',
            'msTransition': 'MSTransitionEnd',
            'transition': 'transitionend'
        },
        transEndEventName = transEndEventNames[Modernizr.prefixed('transition')],
        supportTransitions = Modernizr.csstransitions;
 
    function init() {
 
        // initialize jScrollPane on the content div of the first item
        setJSP( 'init' );
        initEvents();
 
    }
    
    function initEvents() {
 
        // add navigation events
        $navNext.on( 'click', function() {
            bb.next();
            return false;
        } );
 
        $navPrev.on( 'click', function() {
            bb.prev();
            return false;
        } );
        
        // add swipe events
        $items.on( {
            'swipeleft'     : function( event ) {
                if( $container.data( 'opened' ) ) {
                    return false;
                }
                bb.next();
                return false;
            },
            'swiperight'    : function( event ) {
                if( $container.data( 'opened' ) ) {
                    return false;
                }
                bb.prev();
                return false;
            }
        } );
 
        // show table of contents
        $tblcontents.on( 'click', toggleTOC );
 
        // click a menu item
        $menuItems.on( 'click', function() {
 
            var $el = $( this ),
                idx = $el.index(),
                jump = function() {
                    bb.jump( idx + 1 );
                };
            
            current !== idx ? closeTOC( jump ) : closeTOC();
 
            return false;
            
        } );
 
 
        // reinit jScrollPane on window resize
        $( window ).on( 'debouncedresize', function() {
            // reinitialise jScrollPane on the content div
            setJSP( 'reinit' );
        } );
 
    }
 
    function setJSP( action, idx, idx1 ) {
        
        var idx = idx === undefined ? current : idx,
            $content = $items.eq( idx ).children( 'div.content' ),
            apiJSP = $content.data( 'jsp' );
        
        if( action === 'init' && apiJSP === undefined ) {
            $content.jScrollPane({verticalGutter : 0, hideFocus : true });
        }
        else if( action === 'reinit' && apiJSP !== undefined ) {
            apiJSP.reinitialise();
        }
        else if( action === 'destroy' && apiJSP !== undefined ) {
            apiJSP.destroy();
        }
 
    }
 
    function updateTOC() {
        $menuItems.removeClass( 'menu-toc-current' ).eq( current ).addClass( 'menu-toc-current' );
    }
 
    function updateNavigation( isLastPage ) {
        
        if( current === 0 ) {
            $navNext.show();
            $navPrev.hide();
        }
        else if( isLastPage ) {
            $navNext.hide();
            $navPrev.show();
        }
        else {
            $navNext.show();
            $navPrev.show();
        }
 
    }
 
    function toggleTOC() {
        var opened = $container.data( 'opened' );
        opened ? closeTOC() : openTOC();
    }
 
    function openTOC() {
        $navNext.hide();
        $navPrev.hide();
        $container.addClass( 'slideRight' ).data( 'opened', true );
    }
 
    function closeTOC( callback ) {
 
        updateNavigation( current === itemsCount - 1 );
        $container.removeClass( 'slideRight' ).data( 'opened', false );
        if( callback ) {
            if( supportTransitions ) {
                $container.on( transEndEventName, function() {
                    $( this ).off( transEndEventName );
                    callback.call();
                } );
            }
            else {
                callback.call();
            }
        }
 
    }
 
    return { init : init };
 
})();
Помогите плиз решить проблему. Спасибо.

Вернуться к обсуждению:
Статическая панель
0
Вложения
Тип файла: zip FullscreenBookBlock.zip (37.3 Кб, 4 просмотров)
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
08.01.2014, 22:13
Готовые ответы и решения:

Панель BB кодов
Создаю панель BB кодов, как сделать следущее: Как мне определить где...

Меню-панель
Всем привет уважаемые форумчане. Пожалуйста,может кто встречал,как реализовать...

Выдвижная панель
Доброго времени суток! :) Как истинный новичек в JS сижу и уже долго ломаю...

Выскальзывающая панель
Всем привет! Начал изучать js. Вот возник вопрос. Можно ли ниже указанный код...

языковая панель
есть картинка , там все указано (выбирается количество допустимых языков) ,...

8
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Рейтинг@Mail.ru