Отправляет email-рассылки с помощью сервиса Sendsay

Web-программирование - это просто!

Подписаться Бесплатная «Серебряная» новостная рассылка . Подписчиков 681 RSS
←   Август 2011   →
 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


За последние 60 дней ни разу не выходила


Сайт рассылки: http://www.easyprog.ru
Открыта: 27-06-2009
Адрес автора: comp.soft.prog.easyweb-owner@subscribe.ru

Автор
Александр

Статистика

681 подписчиков
0 за неделю
←   Все выпуски   →

Web-программирование - это просто!


Новое на сайте Программирование - это просто! (www.easyprog.ru):

В платном разделе

Программные продукты

В бесплатном разделе

FAQ:

Добрый день, уважаемые подписчики!

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrPageControl».

 

Скачать файлы с описанными классами можно  здесь(версия 1.2)..

Для углубленного изучения web-программирования (язык PHP и написание своей собственной CMS) советую подписаться на платный раздел (см. анонсы раздела "Пишем Easy CMS").

 

Сегодня мы изучим класс CXBrPageControl. Он предназначен для отображения панели страниц. Типа вот такой:

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrPageControl».

 

Для начала, давайте посмотрим тестовый пример:

<HTML>

    <head>

      <title></title>

        <LINK HREF="styles.css" REL="stylesheet" TYPE="text/css">

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrBase.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrGlobalVars.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrGlobalProc.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrVisual.js">

        </SCRIPT>

        <SCRIPT Language="JavaScript" type="text/javascript">

       

            //объявляем пременные

            var Pc;

            var Oc;

            var Vt;

           

            //класс обработки перехода по страницам

            function СХBrVisualObjectTest(object) {

                СХBrVisualObject.call(this,object);

                this._get_class_name=СХBrVisualObject_get_class_name;

                this._hierarchy_classes.push(this._get_class_name());

                this._event_handler=СХBrVisualObjectTest_event_handler;

            }

           

            //обработчик перехода по страницам

            function СХBrVisualObjectTest_event_handler(msg) {

                if(msg._type==msgClick) {

                    this._object.innerHTML="<B>Вы выбрали страницу "+msg._ext.toString()+"<B>";

                    return true;

                }

            }

        </SCRIPT>

    </head>

 

    <BODY>

        <div id="1">

            div1

        </div>

        <div id="2">

 

        </div>

        <SCRIPT Language="JavaScript" type="text/javascript">

       

            function ButtonClick() {

                div1=document.getElementById("1");

                Pc=new CXBrPageControl(div1);

                Oc=new CXBrObjectsContainer();

                div2=document.getElementById("2");

                Vt=new СХBrVisualObjectTest(div2);

               

                Oc._add(Pc);

                Oc._add(Vt);

               

                Pc._draw();

            }

        </SCRIPT>

        <input type="submit" value="Нажать сюда" OnClick="ButtonClick()"><br>

    </BODY>

</HTML>

 

В нем мы объявляем новый класс, для иллюстрации обработки события нажатия на страницу. Этот вспомогательный класс мы строим на базе СХBrVisualObject, переопределяя у него только обработчик сообщений:

            //обработчик перехода по страницам

            function СХBrVisualObjectTest_event_handler(msg) {

                if(msg._type==msgClick) {

                    this._object.innerHTML="<B>Вы выбрали страницу "+msg._ext.toString()+"<B>";

                    return true;

                }

            }

 

Для того, что бы этот обработчик вызывался, мы добавляем экземпляр нашего вспомогательного класса в контейнер, вместе с экземпляром класса CXBrPageControl:

            function ButtonClick() {

                div1=document.getElementById("1");

                Pc=new CXBrPageControl(div1);

                Oc=new CXBrObjectsContainer();

                div2=document.getElementById("2");

                Vt=new СХBrVisualObjectTest(div2);

               

                Oc._add(Pc);

                Oc._add(Vt);

               

                Pc._draw();

            }

 

И вот что нам выдаст тестовый пример:

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrPageControl».

 

Если мы хотим, что бы внешний вид выбранной страницы как то отличался, то мы можем в файл стилей (styles.css) добавить вот такие строки:

.anumber_page_style {

    color:red;

}

 

Вот как это может выглядеть на практике:

 

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrPageControl».

 

Что бы задать внешний вид остальных ссылок на страницу, нам надо задать стиль number_page_style, например вот так:

.number_page_style {

    color:green;

}

 

И вот как это будет выглядеть:

 

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrPageControl».

 

У CXBrPageControl есть и другие возможности, в частности, показывать номер страниц не текстом, а картинками. Но о них я расскажу в других выпусках.

 

С уважением, Шуравин Александр, e-mail: megabax@rambler.ru, автор оставляет за собой право публиковать в рассылках ваши письма, если в письме прямо неоговорено нежелание его публиковать.

 
В избранное