На главную страницу сайта !!!
Прямо в Локальной Сети, Intranet или Internet !!

Object Images Function.

Добавьте страницу
“Object Images Function ”
в Избранное !!
Установите локальную версию goodpc.zip


Назначение страницы.

Представлены простые и довольно действующие Script и HTML листинги,  и Интернет решения..

Метод Object Images Function.

Для создания управления Script приложениями рисунков, возможно использование  метода: Object Images Function.

<script language=javascript>
function fActiveIMG(par) {// Активация событий
     with (document.images[par]){
        onload=function() {
// Загрузка рисунка
              }
        onmouseover=function() {
// Мышка на рисунке
              }
        onmouseout=function() {
// Мышка ушла с рисунка
              }
        onclick= function() {
// Клик мышкой
              }
     }
//end with
} //end function fActiveIMG

// Вызов функций управления параметр MyImg - id рисунка.
fActiveIMG("MyImg")
</script>

Пример использования - Object Images Function.

Далее приведён практический пример: Мой фотоальбом. В котором реализован метод: Object Images Function.

Типовая задача, решаемая многими WEB программистами: Создать Фотоальбом из 3-4 фотографий.

  • Обозначить, что фотография не загружена.
  • После загрузки фотографии:
    • Обозначить факт загрузки фотографии;
    • При наведении мышкой на фотографию, выводить дополнительную информацию;
    • При клике мышкой открывать новое окно.

Исходный код вы можете найти в Zip архиве, файл album.htm.

<!-- Пример внедрения Object Images Function и HTML код примера.
  WEB Страница:  
  Copyright ©   By: Апарышев Валерий Павлович. All rights reserved.-->
<table border="0" width="100%" style="text-align: center">
    <tr>
        <td><img
id=MyImg1></td>
        <td><img
id=MyImg2></td>
        <td><img
id=MyImg3></td>
    </tr>
</table>

 
<script language=javascript>
function OpNewWin(oPageUrl) {// Открыть новое окно
      MyOpWin=window.open(oPageUrl,"WinFirstName")
      MyOpWin.focus() // Окно на передний план
      window.event.returnValue = false
}
function fActiveIMG(par,ImgUrl,PageUrl,Nadpise) { // Переменные вызова:
     // Рисунок , Адрес рисунка, Адрес перехода, Подпись рисунка.
     // Проверка и установка не достающих переменных вызова.
     if ((ImgUrl== undefined)||(ImgUrl=="")) { // Нет переменных вызова!
          window.alert("Установите правильно параметры вызова!")}
     PageUrl = ((PageUrl == undefined)||(PageUrl =="")) ? null : PageUrl
     Nadpise = ((Nadpise == undefined)||(Nadpise ==null)) ? "" : Nadpise
     with (document.images[par]){
       onload=function() { // Обработчик события - Загрузка рисунка.
 
             style.filter=""// Стиль рисунка Сообщение.
              if ( PageUrl !=null ) { // Есть страница для вызова.
                     style.cursor="hand" // Курсор: Рука.
                     alt=((Nadpise == "") ? "" : "Фотография: "+Nadpise+".\n" )+
                            "Кликни: Вызов фотоальбома."}
              else { // Страницы для вызова нет.
                     style.cursor="" // Курсор: По умолчанию.
                      alt="Фотография"+((Nadpise == "") ? "" : ": "+Nadpise)+"." }
     // Обработчики других событий. После загрузки рисунка!
             onmouseover=function() {// Мышка на рисунке. "Статус" сообщение.
                        window.status="Фотография: "+height + " X " + width +" px, "
                                    + Math.ceil(fileSize/1024) + " Kb."}
             onmouseout=function() {// Мышка ушла с рисунка.
                        window.status=""}
 
             if ( PageUrl !=null ) { // Есть страница для вызова.
                          onclick= function() {// Клик мышкой, Вызов новой страницы.
                                OpNewWin(PageUrl)} // Окно на передний план.
             } // end if
          } // End OnLoad.
     // Вывод рисунка и его атрибутов.
          style.border="0"; style.cursor="wait"// Стиль рисунка.
          style.filter="alpha(Opacity=50), gray()"
          alt="Фотография загружается.. " // Сообщение.
          src=ImgUrl // Определение рисунка.
     } //end with.
} //end function fActiveIMG.

// Вызов функций управления Фотографиями.
fActiveIMG("MyImg1","http://img-fotki.yandex.ru/get/11/goodpc.4/0_57a7_eaaed_M.jpg",
                   "http://fotki.yandex.ru/users/goodpc/view/22439/","В бальном платье")
fActiveIMG("MyImg2","http://img-fotki.yandex.ru/get/10/goodpc.4/0_5792_d4bb44d6_M.jpg" ,
                   "http://fotki.yandex.ru/users/goodpc/view/22418/","Горный Властелин")
// Пример вызова с неполными параметрами!!!
fActiveIMG("MyImg3","http://img-fotki.yandex.ru/get/20/goodpc.5/0_78ed_8bdadb02_M.jpg") //,
                   // "http://fotki.yandex.ru/users/goodpc/view/22444/","Мужчина в доспехах")
</script>

Все фотографии взяты из фотоальбомов автора: На этом сайте и Яндекс Фотках. Исходный код вы можете найти в Zip архиве, файл album.htm. Нетрудно видеть, что при выводе более 3 фотографий, HTML и Script код значительно возрастают. Поэтому целесообразно создавать Таблицу в Script приложении... При этом, если создать Объект свойств Фотоальбомов (для нескольких фотоальбомов), то одна страница может отображать разные фотоальбомы. Этот принцип реализован на странице Мобильное фото. Исходный "листинг" вы можете найти в Zip архиве, файл album_obj.htm.

To be continue...

Файлы контроля: 1.htm; other\1.htm; other\i_am\1.htm


Найти:

В


В Начало Страницы:
Object Images Function”.

G

Copyright © 1997 - 2011 By: Апарышев Валерий Павлович. All rights reserved.
Модификация страницы: “Object Images Function” 15 февраля 2011 г.

×µ

For Not Comercial Use !!

µØ

Пошлите Автору Пожалуйста Письмо !!

+


Яндекс.Метрика
Rambler's Top100 Russian America Top. Рейтинг ресурсов Русской Америки.