Logo    
Деловая газета CitCity.ru CITKIT.ru - все об Open Source Форумы Все публикации Учебный центр Курилка
CitForum    CITForum на CD    Подписка на новости портала Море(!) аналитической информации! :: CITFORUM.RU
IT-консалтинг Software Engineering Программирование СУБД Безопасность Internet Сети Операционные системы Hardware

26.03.2017

Google
WWW CITForum.ru
С Новым годом!
2001 г

Полоса новостей на php с использованием javascript и слоев.

Добрый день!

Решил написать статью о программировании на php на примере экспорта новостей с сайта http://www.gazeta.ru. Но не в том виде, который они предлагают, а по-своему, компактно и интересно.

Такой пример вы можете увидеть на страницах сайтов http://www.czar.ru или же http://www.russianjudo.ru.

Если вместо новостей пусто или сообщение об ошибке (зависит от настроек сервера), это значит, что сервер gazeta.ru сильно занят и не может обслужить всех желающих получить новости. Можно конечно брать новости и с других серверов, но так как мы рассматриваем реально работающий пример программирования, то будем работать с ним.

Как же создать такую новостную полосу? Все довольно просто. Заходим на сайт и находим пункт "экспорт новостей". http://www.gazeta.ru/explogin.html. Там нам предлагают экспортировать на свой сайт новостную полосу с их ресурса.

Мы радуемся и регистрируемся. Все абсолютно бесплатно и, главное, стабильно. Например (реальная регистрация, можете зайти и проверить, а также, можете там изменять рубрики, получаемые нами в новостной полосе), ввели имя news_list, пароль qwer мейл - ваш (реально, в этом примере - мой), адрес сайта любой, например - citforum.ru. Затем понадобится только лишь имя и пароль.

Теперь заходим и смотрим, чтоже они нам предлагают. С удовольствием отмечаем довольно широкий спектр новостей.

  1. Первая полоса
  2. Полоса политики
  3. Полоса бизнеса
  4. Полоса культуры
  5. Полоса спорта
  6. Автомобильные новости
  7. Бизнес новости
  8. Спортивные новости
  9. Новостная лента
  10. Полоса International
  11. News in English
  12. Полоса общества
  13. Полоса финансов
  14. Полоса автомобилей
  15. Новость часа
  16. Молния

Выбираем интересное и устанавливаем количество новостей в каждой рубрике.

Ниже выбираем кодировку новостей. Она должна совпадать с кодировкой вашего сайта. Например - win1251.

Затем выбираем вид новостей (с датой, с временем и без них). Проще выбрать пустую новость. Хотя программа будет работать в любом случае.

Верх и низ новостей оформлять не нужно.

Получаем строку, которую надо запомнить: <script language="javascript" src="http://www.gazeta.ru/cgi-bin/export/export.cgi?id=2743"></script>

Из нее извлекаем полезное: Адрес cgi-скрипта, который и формирует наши новости на gazeta.ru. Этот адрес: http://www.gazeta.ru/cgi-bin/export/export.cgi?id=2743

Таким образом, мы имеем страницу, с которой нам надо изъять код ссылок на новости gazeta.ru к себе. Она имеет приблизительно такой вид:

var news="";
news+="<a href=\"http://www.gazeta.ru/2001/10/07/400dnejsborn.shtml\">текст1</a><br>";
news+="<a href=\"http://www.gazeta.ru/2001/10/08/last32746.shtml\">текст2</a><br>";
document.write(news);

Нам надо:

  1. найти строки со ссылками
  2. убрать в них \ и лишние ";
  3. добавить еще один <br>
  4. добавить открытие ссылки в новом окне и вызов функции javascript (target=_blank onMouseOver=clearTimeout(timeOut) onMouseOut=init())

Чтобы получить из всего этого:

<a href="http://www.gazeta.ru/2001/10/07/400dnejsborn.shtml"
target=_blank onMouseOver=clearTimeout(timeOut) onMouseOut=init()>текст1</a><br><br>
<a href="http://www.gazeta.ru/2001/10/08/last32746.shtml"
target=_blank onMouseOver=clearTimeout(timeOut)
onMouseOut=init()>текст2</a><br><br>

Задачи поставлены.

Код программы создания блока новостей.

Вот код программы с комментариями и пояснениями, которая создает массив новостей.

<? // начинаем работать
$adr='http://www.gazeta.ru/cgi-bin/export/export.cgi?id=1372'; //адрес пациента
$begin='<a href'; // слово, по которому будем искать начало ссылки
$end='<br>"'.chr(59); //слово конца ссылки
$end_new='<br><br>'; //новый конец новости (в своем варианте мы сделаем
//больше разрыв между новостями, чтобы они читались раздельно)
$noscript='">'; // конец ссылки a href без скрипта и таргета
$script='" target="_blank" onMouseOver=clearTimeout(timeOut) onMouseOut=init()>';
// конец ссылки с таргетом и вызовом ява-скрипта
$screen=file($adr); // читаем страницу новостей - оригинал
$j=0; // количество новостей
for ($i=0; $i<sizeof($screen); $i++) { // отслеживаем строки страницы
	if (strpos($screen[$i],$begin,0)==false) {
	// есть ли ссылка на новость в строке?
	// определяем по наличию в строке слова начала ссылки $begin
		// если нет новости в строке
	}
	else { // если все-же есть новость в строке.
		$screen[$i]=stripslashes(screen[$i]);
		// заменяем \" на "
		$str=explode($begin,$screen[$i]);
		// разбиваем строку на массив подстрок
		// разбитие производим словом начала ссылки.
		// Первым элементом массива получим ссылку + то, что после нее.
		$str[1]=$begin.$str[1];
		// Возвращаем ссылке ее начало (слово, которым разбивали строку)
		$scr[$j]=str_replace($end,$end_new,$str[1]);
		// заменяем конец строки новости
		$scr[$j]=str_replace($noscript,$script,$scr[$j]);
		// добавляем в ссылку таргет и вызов ява-скрипта
		echo $scr[$j];
		// выводим ссылку на экран.
		$j++; // плюсуем единичку к счетчику новостей
	}
}
?> // конец программы создания массива новостей.

Итак, имеем код программы, которая создает слой, который двигается снизу вверх посредством ява-скрипта.

Ява-скрипт представляет собой программу, протаскивающую блок с новостями в слое с выбираемыми вами размерами и положением. Программа работает и в IE4+ и в NN.

Теперь о ява-скрипте и встраивании в страницу.

<html>
<head>
<link rel=stylesheet href=scroll.css>
<script language=javascript>
<!--
startFrom=70;
//Начальное положение блока новостей (по вертикали) - нижняя отметка
currentY=startFrom; //Текущее положение блока новостей (по вертикали)
wait=300; //Задержка движения блока, миллисекунды
timeOut=null; //Временная переменная
//Перемещение блока
function moveUp()
{
	currentY-=3; //Уменьшаем счетчик
	if(currentY<minY)currentY=startFrom;
	//Если дошли до минимальной отметки - нужно сдвинуть слой обратно
	eval(objScroll+stylePrefix+'.top='+currentY);
	//А теперь сдвигаем слой туда, куда указывает счетчик
	timeOut=setTimeout("moveUp()",wait);
	//И через wait секунд снова вызываем moveUp()
	
}
//Инициализация
function init(){
//Определяем тип браузера
var ie=(navigator.appName=="Microsoft Internet Explorer")?1:0;
var nn=(navigator.appName=="Netscape")?1:0;
//В зависимости от типа браузера, определяем переменные:
//objScroll - слой, который нужно двигать
//stylePrefix - имя свойства, ссылающегося на стили объекта
//minY - минимальная отметка, до которой можно сдвигать слой
if(ie){	objScroll='document.all.dScroll';
	stylePrefix='.style';
	minY=-eval(objScroll+'.offsetHeight');
	}
if(nn){
objScroll='document.layers.dBox.document.layers.dWindow.document.layers.dScroll';
stylePrefix='';
minY=-eval(objScroll+'.clip.height');
}
moveUp(); //начинаем сдвигать слой

}//-->
</script>
</head>
<body>
<table width="240" height="60" align="center" border=0 cellpadding=0 cellspacing=0>
<tr>
<td valign=top width=240 height=60 bgcolor=#ffffff>
<div id=dBox><div id=dWindow><div id=dScroll>
<!-- Здесь собственно должен быть текст блока.... -->
<!-- И внизу строка, которая и вставляет блок. -->
<!-- Вышеописанная программа на php должна находиться в этом файле news.php -->
<!--#include virtual="news.php"  -->
</div></div></div>
</td></tr></table>
<script language="Javascript">init()</script>
</body>
</html>

Как видим, мы пользуемся слоями. Есть слои, на которых размещен слой с текстом новостей. Последний слой мы прокручиваем снизу вверх. Выставляем скорость движения задержкой движения wait. При поднесении мышки к ссылке, движение прекращается до того, пока мышка не сойдет со ссылки.

А вот как надо описать слои в файле scroll.css, на который стоит ссылка <link rel=stylesheet href=scroll.css>

#dBox{
	position:relative;
	//Считаем лефт и топ от левого верхнего угла объекта,
	//внутри которого находится слой
	z-index:240; //Побольше, чтоб не перекрыло другими элементами страницы
	top:0;left:0; //Отступы сверху и слева
	width:240px;height:60px; //Ширина и высота
} 
#dWindow{
	position:absolute;
	//Поскольку слой в слое, то считается от верхнего левого угла dBox
	z-index:240; //Такой же, как у dBox
	top:0;left:0; //Отступы сверху и слева
	clip:rect(0,240,60,0);
	//Определяем слой как прямоугольник шириной 240 и высотой 60
} 
#dScroll{
	position:absolute; //То же, что и с dWindow
	z-index:238;  //"Прячем" слой за dBox'ом
	top:60;left:2; //Сразу сдвигаем на нужное расстояние вниз
	width:238px;height:60px; //Ширина и высота
	visibility:visible; //Видимый слой
	text-align:left; //Текст выровнен по левому краю слоя
	font-family:arial,helvetica,sans-serif; font-size:11px; color:#000000;
	//Стили для текста
}

Прошу не забыть и удалить комментарии в тексте описания слоев. Иначе работать не будет.

А лучше, приведу текст без комментариев (именно его копируйте и редактируйте):

#dBox{position:relative; z-index:240; top:0;left:0; width:240px;height:60px;} 
#dWindow{position:absolute; z-index:240; top:0;left:0; clip:rect(0,240,60,0);} 
#dScroll{position:absolute; z-index:238; top:60;left:2; width:238px;height:60px;
visibility:visible; text-align:left; font-family:arial,helvetica,sans-serif;
font-size:11px; color:#000000;}

Чуть ниже в коде страницы вставляем запуск ява-скрипта, который прокручивает наши новости по слою снизу вверх:

<script language="Javascript">init()</script>

Обычно этот вызов ставят в конце страницы или даже по событию onload, но можно делать это и раньше, что вам и советую.

Таким образом, оперируя с координатами слоев, можно выставить нужное его положение, размеры. А выставляя скорость, можно заставить посетителей читать новости с желаемой скоростью.

Вариант, когда новости выводятся на нашем сайте я опубликую в следующей статье.

Тотоев Александр
www.czar.ru
www.nova-wings.ru
www.russianjudo.ru

Корхова Ольга
(автор кода ява-скрипта движения слоя)
www.chtpz.ru

 

Размещение рекламы — тел. +7 495 4119920, ICQ 232284597

Подписка на новости IT-портала CITForum.ru
(библиотека, CITKIT.ru, CitCity)

Новые публикации:

24 декабря

CITKIT.ru:

  • Новогодние поздравления
  • Сергей Кузнецов. Цикл Операционные системы: Ностальгия по будущему:

  • Алексей Федорчук. OpenSolaris 2008.11 Release

  • Сергей Голубев:

  • Евгений Чайкин aka StraNNik (Блогометки):

    17 декабря

  • С.Д.Кузнецов. Базы данных. Вводный курс

    10 декабря

    CITKIT.ru:

  • OpenSolaris 2008.11 Release

  • Альтернативные ОС: две грустные истории (С.Кузнецов)
  • Nokia N810 — доведение до ума
  • CitCity:

  • Платформа 2009: заоблачные перспективы Microsoft

    4 декабря

  • Лекция С.Д.Кузнецова Понятие модели данных. Обзор разновидностей моделей данных

    CITKIT.ru:

  • OpenSolaris 2008.11 Release. Первые впечатления

  • Linux vs FreeBSD: продолжим "Священные войны"?

  • Nokia N810 as is

  • Индульгенция для FOSS

  • Друзья СПО'2008

    26 ноября

  • Нечеткое сравнение коллекций: семантический и алгоритмический аспекты

    CitCity:

    CITKIT.ru:

  • Глава из книги А.Федорчука
    Сага о FreeBSD:
  • 19 ноября

  • Проблемы экономики производства крупных программных продуктов

  • Язык модификации данных формата XML функциональными методами

    CITKIT.ru:

  • Главы из книги А.Федорчука
    Сага о FreeBSD:

    Заметки к книге:

  • FreeBSD: монтирование сменных устройств и механизм HAL
  • Текстовый редактор ee

    12 ноября

  • Правило пяти минут двадцать лет спустя, и как флэш-память изменяет правила (Гоц Грейф, перевод: Сергей Кузнецов)

    CITKIT.ru:

  • Главы из книги А.Федорчука
    Сага о FreeBSD:
  • OSS в России: взгляд правоведа (В.Житомирский)

  • Новая статья из цикла С.Голубева "Железный марш":

    29 октября

  • О некоторых задачах обратной инженерии

  • Веб-сервисы и Ruby

  • Тестирование web-приложений с помощью Ruby

    CITKIT.ru:

  • Главы из книги А.Федорчука
    Сага о FreeBSD:

  • PuppyRus Linux - беседа с разработчиком (С.Голубев)

  • Сергей Кузнецов. Заметка не про Linux

    22 октября

  • Обзор методов описания встраиваемой аппаратуры и построения инструментария кросс-разработки

    CITKIT.ru:

  • Сергей Кузнецов. Почему я равнодушен к Linux

  • Глава из книги А.Федорчука
    Сага о FreeBSD:
  • Что надо иметь
    3. Базовые познания

    CitCity:

  • Управление IT-инфраструктурой на основе продуктов Microsoft

    15 октября

  • Методы бикластеризации для анализа интернет-данных

    CitCity:

  • Разъемы на ноутбуках: что они дают и зачем их так много?
  • AMD Puma и Intel Centrino 2: кто лучше?

    CITKIT.ru:

  • Новый цикл статей С.Голубева
    Железный марш:

  • Главы из книги А.Федорчука
    Сага о FreeBSD:

    8 октября

  • Автоматизация тестирования web-приложений, основанных на скриптовых языках
  • Опыт применения технологии Azov для тестирования библиотеки Qt3

    Обзоры журнала Computer:

  • SOA с гарантией качества
  • Пикоджоуль ватт бережет
  • ICT и всемирное развитие

    CitCity:

  • Пиррова победа корпорации Microsoft

    CITKIT.ru:

  • Главы из книги А.Федорчука
    Сага о FreeBSD:

    Статья из архива:

  • Я живу в FreeBSD (Вадим Колонцов)

    Новые Блогометки:

  • Перекройка шаблона Blogger или N шагов к настоящему
  • Blogger. Comment style
  • Screenie или глянцевый снимок экрана

    2 октября

    CITKIT.ru:

  • Сага о FreeBSD (А. Федорчук)

    Zenwalk: пакет недели

  • Банинг — интеллектуальное развлечение (С.Голубев)

    CitCity:

    25 сентября

  • Клермонтский отчет об исследованиях в области баз данных

    CITKIT.ru:

  • Пользователям просьба не беспокоиться... (В.Попов)

  • Снова про ZFS: диск хорошо, а два лучше
  • Командная оболочка tcsh (А.Федорчук)

    Zenwalk: пакет недели

    17 сентября

  • T2C: технология автоматизированной разработки тестов базовой функциональности программных интерфейсов
  • Технология Azov автоматизации массового создания тестов работоспособности

    CITKIT.ru:

  • FreeBSD: ZFS vs UFS, и обе-две — против всех (А.Федорчук)

    Zenwalk: пакет недели

  • Дачнет — практика без теории (С.Голубев)

    10 сентября

  • За чем следить и чем управлять при работе приложений с Oracle
  • Планировщик заданий в Oracle
    (В.Пржиялковский)

    CITKIT.ru:

  • Microsoft: ответный "боян" (С.Голубев)

  • Причуды симбиоза, или снова "сделай сам" (В.Попов)

  • Файловые системы современного Linux'а: последнее тестирование
  • Zsh. Введение и обзор возможностей
    (А.Федорчук)

    Описания пакетов Zenwalk: Zsh, Thunar, Thunar-bulk-rename, Xfce4-places-plugin, Xfce4-fsguard-plugin

    Блогометки:

  • Google Chrome
  • Лончер для ASUS Eee PC 701

    3 сентября

    CITKIT.ru:

  • Заметки о ядре (А.Федорчук):

    Добавлены описания пакетов Zenwalk: Galculator, Screenshot, Gnumeric, Pidgin

    В дискуссинном клубе:

  • И еще о Википедии и Google Knol

  • Лекция для начинающего линуксоида (С.Голубев)

    26 августа

  • Транзакционная память (Пересказ: С. Кузнецов)

    CITKIT.ru:

  • Открыт новый проект Zenwalk: пакет недели

  • Статья Текстовые процессоры и их быстродействие: конец еще одной легенды?

    21 августа

    CITKIT.ru:

  • Почему школам следует использовать только свободные программы (Ричард Столлман)
  • Беседа Сергея Голубева с учителем В.В.Михайловым

  • Википедия или Гуглезнание? Приглашение к обсуждению (Алексей Федорчук)
  • Народная энциклопедия от Google (StraNNik)

  • Обзор Mandriva 2009.0 Beta 1 Thornicrofti
  • Новичок в Линукс: Оптимизируем Mandriva 2008.1

  • Книга Zenwalk. Приобщение к Linux:

    13 августа

    CitCity:

  • Мирный Atom на службе человеку. Обзор платы Intel D945GCLF с интегрированным процессором
  • Обзор процессоров Intel Atom 230 на ядре Diamondville

  • iPhone - год спустя. Скоро и в России?

    CITKIT.ru:

  • Интермедия 3.4. GRUB: установка и настройка (из книги Zenwalk. Приобщение к Linux)

    6 августа

  • СУБД с хранением данных по столбцами и по строкам: насколько они отличаются в действительности? (Пересказ: С. Кузнецов)

    CITKIT.ru:

  • Интермедия 2.2. Что неплохо знать для начала (из книги Zenwalk. Приобщение к Linux)

  • И снова про шрифты в Иксах (А.Федорчук)

  • 20 самых быстрых и простых оконных менеджеров для Linux

  • Дело о трех миллиардах (С.Голубев)

    30 июля

  • OLTP в Зазеркалье (Пересказ: С. Кузнецов)

    CitCity:

  • Будущее BI в облаках?
  • Тиражные приложения и заказная разработка. Преимущества для заказчика
  • Дискуссия со сторонниками заказной разработки

    CITKIT.ru:

  • Новые главы книги Zenwalk. Приобщение к Linux:
  • Глава 8. Пакеты: средства установки, системы управления, системы построения
  • Глава 9. Zenwalk: репозитории, пакеты, методы установки

    23 июля

    CITKIT.ru:

  • Все против всех. 64 vs 32, Intel vs AMD, tmpfs vs ext3
  • Две головы от Intel

  • Zenwalk: обзор штатных приложений (глава из книги "Zenwalk. Приобщение к Linux")

  • Нормально, Григорий...

    16 июля

    Обзоры журнала Computer:

  • Перспективы и проблемы программной инженерии в XXI веке
  • Большие хлопоты с большими объемами данных
  • Перспективы наноэлектроники

    CITKIT.ru:

  • Интермедия о лицензиях (А.Федорчук. "Zenwalk. Приобщение к Linux")

  • Есть ли будущее у KDE?

  • Linux в школе: альтернативный вариант в задачах

  • Шифр (приключения агента Никодима)

    10 июля

    CITKIT.ru:

  • Новые разделы книги А. Федорчука Zenwalk. Приобщение к Linux:
  • Интермедия вступительная. Linux или GNU/Linux? Как вас теперь называть?
  • Глава 5. Среда Xfce
  • Глава 6. Xfce: приложения и плагины

  • ZUR (Zenwalk User Repository) FAQ

    2 июля

  • Персистентность данных в объектно-ориентированных приложениях (С. Кузнецов)

    CITKIT.ru:

  • Новые разделы книги А. Федорчука Zenwalk. Приобщение к Linux:
  • Интермедия 1.2. Дорога к Zenwalk'у. Период бури и натиска
  • Интермедия 3.3. Немного о Linux'е и "железе"
  • Глава 4. Настройка: инструментами и руками
  • Интермедия 4.1. Zenpanel и конфиги: поиски корреляции

  • Интервью с Жан-Филиппом Гийоменом, создателем дистрибутива Zenwalk

  • Linux в школе: первые итоги (С. Голубев)

    25 июня

    CITKIT.ru:

  • Zenwalk. Приобщение к Linux (А. Федорчук)

  • Логика и риторика (С.Голубев)

  • Технология Tru64 AdvFS

  • Ханс Райзер предлагает отвести полицейских к телу Нины

    18 июня

  • Проекты по управлению данными в Google (Пересказ: С. Кузнецов)

    CITKIT.ru:

  • ОС и поддержка "железа": мифы и реальность (А. Федорчук)

  • Linux в школе: другие дистрибутивы

  • Пинок (С. Голубев)

    4 июня

  • Ландшафт области управления данными: аналитический обзор (С. Кузнецов)

    CITKIT.ru:

  • Linux в школе: слово заинтересованным лицам

  • SlackBuild: пакеты своими руками

  • Linux от компании Novell. Установка и обзор openSUSE Linux

    Все публикации >>>




  • IT-консалтинг Software Engineering Программирование СУБД Безопасность Internet Сети Операционные системы Hardware

    Информация для рекламодателей PR-акции, размещение рекламы — тел. +7 495 4119920, ICQ 232284597 Пресс-релизы — pr@citcity.ru
    Послать комментарий
    Информация для авторов
    Rambler's Top100 TopList liveinternet.ru: показано число просмотров за 24 часа, посетителей за 24 часа и за сегодня This Web server launched on February 24, 1997
    Copyright © 1997-2000 CIT, © 2001-2007 CIT Forum
    Внимание! Любой из материалов, опубликованных на этом сервере, не может быть воспроизведен в какой бы то ни было форме и какими бы то ни было средствами без письменного разрешения владельцев авторских прав. Подробнее...