Просмотр полной версии : Небольшие статьи [html, Css, Js, Php]
В этой теме выкладывайте небольшие актуальные статьи по всем направлениям кодинга
Защищаем ссылки mailto
Автор: 15daysofjquery.com (http://15daysofjquery.com)
Перевод: Isis
Защитить email адреса на своем сайте от спамеров легко с использованием AJAX.
В данноме случае будем использовать библиотеку jQuery: http://www.jquery.com
Пример с кнопкой. Без эффекта. (http://15daysofjquery.com/examples/mailto/demo1.php)
Пример с ссылкой. Эффект выпадания. (http://15daysofjquery.com/examples/mailto/demo2.php)
При загрузке страницы. Эффект выпадания. (http://15daysofjquery.com/examples/mailto/demo3.php)
При загрузке страницы. Без эффекта. (http://15daysofjquery.com/examples/mailto/demo4.php)
JS Код:
$(document).ready(function(){
$.post('mailtoInfo.php',{
pass: "secret"
},function(txt){
$('div.email').html(txt);
$('div.email').slideDown("slow");
});
});
Т.е. отправляем POST запрос с параметром pass и его значением secret на mailtoInfo.php
Ответ выводится в <div id="email"></div>
Тем самым никакой робот не выловит email, а пользователям не добавится сложности
YoYo Factory
29.05.2008, 00:45
Решил поддержать нашего любимого Isis`a ;)
Выплывающее меню, скрипт откуда достал не помню но меню выплывает прикольно короче выглядит прикольно и можно подстроить под любой дизайн! Для полной работоспособности нужны картинки, которые вы можете поменять под свой дизайн! Вот сами файлы:http://rapidshare.com/files/118392597/menu.rar.html
Скрипт выкладывать не вижу смысла, скрипт большой (имеется внутри архива)
часто сталкивался во время верстки с проблемой отображения изображений формата .png (помоему только в нем можно сохранять полупрозрачные изображения) в Internet Explorer, собственно нашел фильтр с помошью которого можно решить эту проблему:
в css прописываем это:
.img_png
{
width:100px;
height:100px;
background-image:url('image.png'); background-repeat:no-repeat;
//background-image:none;
//filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='image.png',sizingMethod='scale');
}
а в самом коде создаем для этой картинки отдельную таблицу с размерами картинки, это необходимо из за того что експлорер растягивает изображение на всю ячейку и получается полное гэ :
<td>
<table width="100" height="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="img_png" width="100" height="100">
<img style="visibility:hidden;" src="0.gif" width="100" height="100">
</td>
</tr>
</table>
</td>
надеюсь каму нибудь пригодится...
jQuery:
[jquery] Создаем красивый просмотрщик галереи (http://forum.antichat.ru/thread71867.html)
[jquery] Работаем с drag&drop (перемещение+сбрасыввание) (http://forum.antichat.ru/thread72046.html)
.png и експлорер
у jquery есть плагин phg_fix, я про него писал
.png и експлорер
у jquery есть плагин phg_fix, я про него писал
ну так замечательно если есть много вариантов=)
Несколько полезных CSS приемов:
Альтернатива NOBR
.nobr{white-space:nowrap;}
Альтернатива cellspacing и cellpadding
<style type="text/css">
/* cellspacing=0 */
TABLE {border-collapse:collapse;}
/* cellpadding=0 */
TABLE TD {padding:0px;}
/* cellspacing=2 */
TABLE {border-collapse: separate; border-spacing:2px;}
/* cellpadding=2 */
TABLE TD {padding:2px;}
</style>
Цвет hr через CSS (IE, Opera, Mozilla)
hr {
color:red;
background-color:red;
height: 1px;
border-width:0px;
}
Рамки таблицы и ячеек толщиной в 1px
table.table1, table.table1 td {
border:1px solid blue;
border-collapse:collapse;
}
Лишнее пространство вокруг формы
form {
margin:0;
}
Запрет полосы прокрутки
body {
overflow:hidden;
}
Лишнее пространство вокруг формы
form {
margin:0;
}
после нуля нада указывать в чем измерЯешь - "px" , так грамотнее
Корвин
Какая разница в чем? Все равно ведь 0. Я так всегда пишу.
ну у каждого свое мнение, я высказал свое, нафлудили тут....
после нуля нада указывать в чем измерЯешь - "px" , так грамотнее
Лучше писать без обозначений + ко всему это снижает скорость загрузки стиля..
Если хочешь, можем тут поспорить.
//Машка ;-)
astrologer
09.06.2008, 21:37
В таких вопросах надо полагаться на спецификацию (http://www.w3.org/TR/CSS21/syndata.html#length-units), которая гласит:The format of a length value (denoted by <length> in this specification) is a <number> (with or without a decimal point) immediately followed by a unit identifier (e.g., px, em, etc.). After a zero length, the unit identifier is optional.Таким образом, оба варианта одинаково допустимы и грамотны.
GreenBear
09.06.2008, 23:33
+ ко всему это снижает скорость загрузки стиля..
на целых два байта... ты выйграл еше полторы наносекунды, гонщик спиди бля...
Таким образом, оба варианта одинаково допустимы и грамотны.
Согласно спецификациям - да. Но теория и практика вещи разные: существуют браузеры, которые не очень-то и уважают стандарты и трактуют величины так, как им удобнее, а не так как правильно. Т.е. ваше height: 10, по задумке измеряющееся в пикселах вполне может быть распознано в эмах.
Кроме того есть еще т.н. quirks mode (популянро читаем тут (http://www.artlebedev.ru/tools/technogrette/html/doctype/) и тут (http://www.artlebedev.ru/tools/technogrette/html/doctype2/)), который способен убить много нервных клеток в организме горе-верстальщика, не указавшего величину измерения.
Отcюда вывод - единицы измерения ставим обязательно, хотя бы ради того, чтобы тыблицы стилец были красивыми и читаемыми.
ЗЫ: а по поводу мнимой экономии траффика - единицы измерения ничего не решают. Решает сжатие файла - как структурное (убрать whitespace), так и физическое (gzip)
я же сразу написал что у каждого свое мнение, и спорить тут можно вечно , все равно каждый будет по своему делать=)
life_is_shit
19.06.2008, 10:36
Для того, чтобы подгрузить нестандартный шрифт на веб-странцу нужно сделать следующее.
Первое установить специальную программу которая преобразует ttf в eot формат,
что позволит нам потом подключить его
в css. (программа тут (http://download.microsoft.com/download/8/a/1/8a1be03f-f7fc-4504-af9a-7b9230775284/WEFTIII2b1.exe)).
После установки запускаем программу и затем tools->font to embed и добавляем шрифты которые хотим конвертировать
(замечание: не все шрифты можно конвертить).
Затем на панели меню (главное окно) ищим кнопку "Embed" (сразу пере ) "help".
Появляется окошко в котором указываем путь куда будет сохранен файл, указываем ссылку для какой страницы будет использоваться фонт,
и ставим галочку показать сразу css в итоге получаем
<STYLE TYPE="text/css">
<!-- /* $WEFT -- Created by: Unknown (Unknown) on 18.12.2007 -- */
@font-face {
font-family: Palatino Linotype;
font-style: normal;
font-weight: normal;
src: url(file:///c:\PALATIN0.eot);
} -->
</STYLE>
Копируем стиль в stylesheet.css копируем eot файл и меняем src, все готово!
В целом что этой штукой нужно пользоваться очень осторожно и в крайне редких случаях.
life_is_shit угу... только здесь встает очень резонный вопрос об авторских правах =) Ибо почти все нормальные шрифты требуют отчислений - а на свободнораспросьтраняемые без слез не глянешь.
life_is_shit
19.06.2008, 13:13
задачи разные бывают=) и среди свободных нормальные есть.
задачи разные бывают=) и среди свободных нормальные есть.
Ну это конечно да... если проект не оч крупный - то к тебе претензии вряд ли будут предъявлять... хотя кто их знает, что им в голову стукнуть может :)
Не то чтобы статья..... но вот такую я написал css-ку для резки рекламы на nnm.ru
*[id*="MarketGid"],*[class*="inki2"], *[class*="right-banner"], *[src="http://nnm.ru/reclama/alpari.swf"] {
display: none !important;
}
тестил в опере 9.5
ОБНОВИЛ
css свойства в javascript (сама таблица (http://codepunk.hardwar.org.uk/css2js.htm))
например, для изменения стиля другого объекта средством js
<script language="javascript">
function underline(eto) {
eval('document.all.'+eto+'.style.textDecoration = "underline"');
eval('document.getElementById("' + eto + '").style.textDecoration = "underline"');
}
function nounderline(eto) {
eval('document.all.'+eto+'.style.textDecoration = "none"');
eval('document.getElementById("' + eto + '").style.textDecoration = "none"');
}
</script>
<a onMouseOver="underline('eto')" onMouseOut="nounderline('eto')">Подчеркнуть</a>
<div id="eto">это</div>
Взаимодействие JavaScript с CSS
background
Доступ: Чтение/Изменение
Атрибут элемента CSS background . Обозначенное свойство состоит из строки разграниченных пространством значений для свойств backgroundAttachment, backgroundColor, backgroundImage, backgroundPosition, и backgroundRepeat . Может быть одно или более значение background , и значения могут идти в любом порядке.
Пример:
document.all.tags("DIV").style.background = "url(logo.gif) repeat-y"Возвращаемое значение: Строка разграниченных пространством значений, соответствующих одному или более отдельным свойствам стиля background.
Значение по умолчанию: Ничего.
backgroundAttachment
Доступ: Чтение/Изменение
Устанавливает, как изображение "сопоставлено" с элементом. Изображение может или оставаться неподвижным в пределах просматриваемой области (области просмотра) или может прокручиваться с элементом, если документ большой.
Пример:
document.all.tags("DIV").style.backgroundAttachment = "fixed"Возвращаемое значение: Строка из допустимого значения: fixed | scroll.
Значение по умолчанию: scroll
backgroundColor
Доступ: Чтение/Изменение
Цвет фона элемента. Если Вы также устанавливаете backgroundImage, изображение будет поверх цвета. Прозрачные пикселы изображения позволяют цвету проглядываться через него.
Пример:
document.all.highlighted.style.backgroundColor = "yellow"Возвращаемое значение: Любая действующая спецификация цвета.
Значение по умолчанию: Ничего.
backgroundImage
Доступ: Чтение/Изменение
URL фонового изображения элемента. Если Вы также устанавливаете backgroundColor, изображение будет поверх цвета.Прозрачные пикселы изображения позволяют цвету проглядываться через него.
Пример:
document.all.navbar.style.backgroundImage = "images/navVisited.jpg"Возвращаемое значение: Любой полный или локальный URL к файлу изображения.
Значение по умолчанию: Ничего.
backgroundPosition
Доступ: Чтение/Изменение
Местоположение фонового изображения относительно области элемента (плюс дополнение). Это свойство должным образом не реализовано в Internet Explorer 4 для Macintosh.
Пример:
document.all.div3.style.backgroundPosition = "20 50" Возвращаемое значение: Вы должны быть способны определить один или два процента от ширины поля блока и высоты (соответственно), в какой точке изображения начинаются повторные изображения. Установка значений в процентах, однако, не всегда работает в IE 4 для Windows (и не работает на Mac вообще), даже при том, что они установлены как значения по умолчанию. Вам будет безопаснее всего использовать значения в пикселах (как разграниченные пробелом значения внутри одной строки). Ни одна из позволенных констант, кроме TOP и LEFT, не признана.
Значение по умолчанию: 0% 0%
backgroundPositionX, backgroundPositionY
Доступ: Чтение/Изменение
Top и left местоположения фонового изображения относительно области элемента (плюс дополнение). Эти свойства не реализованы должным образом в Internet Explorer 4 для Macintosh.
Пример:
document.all.div3.style.backgroundPositionX = "20" document.all.table2.style.backgroundPositionY = "10"Возвращаемое значение: Вы должны быть способны определить один или два процента от ширины поля блока и высоты (соответственно), в какой точке изображения начинаются повторные изображения. Установка значений в процентах, однако, не всегда работает в IE 4 для Windows (и не работает на Mac вообще), даже при том, что они установлены как значения по умолчанию. Вам будет безопаснее всего использовать значения в пикселах (как разграниченные пробелом значения внутри одной строки). Ни одна из позволенных констант, кроме TOP и LEFT, не признана.
Значение по умолчанию: 0
backgroundRepeat
Доступ: Чтение/Изменение
Должно ли фоновое изображение (указанное свойством backgroundImage ) повторяться и, если так,то по какой оси. Вы можете использовать повторяющиеся фоновые изображения, чтобы создать горизонтальные и вертикальные полосы с некоторыми параметрами настройки.
Пример:
document.all.div3.style.backgroundRepeat = "repeat-y"Возвращаемое значение: С установкой no-repeat, один образец изображения появится в пределах элемента, установленного свойством backgroundPosition (значение по умолчанию - верхний левый угол). Обычно повторения выполнены по обеим осям, но Вы можете назначить повторение изображения вниз единственным столбцом (repeat-y) или вправо единственной строкой (repeat-x).
Значение по умолчанию: repeat
border
Доступ: Чтение/Изменение
Свойство для получения или установки свойств borderColor, borderStyle и/или borderWidth изо всех четырех границ вокруг элемента в одной инструкции. Вы должны определить стиль границы (см. borderStyle) для изменения этого свойства, чтобы затронуть границы элемента. Другие свойства позволяют Вам устанавливать ширину, стиль и цвет границ или их групп, если Вы не хотите, чтобы все четыре границы были одинаковыми. Только параметры настройки, явно указанные в атрибутах тэга, отражены в свойстве, но Вы можете назначать компоненты не как часть первоначального тэга.
Пример:
document.all.announce.style.border = "inset red 4px"Возвращаемое значение: Для составляющих значений borderStyle и borderWidth см. соответствующие свойства в этой главе.
Значение по умолчанию: Ничего.
borderRight, borderTop
Доступ: Чтение/Изменение
Свойство для получения или установки свойств borderColor, borderStyle и/или borderWidth для отдельного края элемента в одной инструкции. Вы должны определить стиль границы (см. borderStyle) для изменения этого свойства, чтобы затронуть границы элемента. Если Вы хотите, чтобы все четыре грани были одинаковыми, см. атрибут границы. Только параметры настройки, явно указанные в атрибутах тэга, отражены в свойстве, но Вы можете назначать компоненты не как часть первоначального тэга.
Пример:
document.all.announce.style.borderBottom = "inset red 4px" document.all.announce.style.borderLeft = "solid #20ff00 2px" document.all.announce.style.borderRight = "double 3px" document.all.announce.style.borderTop = "outset red 8px"Возвращаемое значение: Для составляющих значений см. соответствующие свойства borderEdgeStyle и borderEdgeWidth.
Значение по умолчанию: Ничего.
borderBottomColor, borderLeftColor, borderRightColor, borderTopColor
Доступ: Чтение/Изменение
Цвет одного края границы элемента.
Пример:
document.all.announce.style.borderBottomColor = "red"
document.all.announce.style.borderLeftColor = "#20ff00"
document.all.announce.style.borderRightColor = "rgb(100, 75, 0)"
document.all.announce.style.borderTopColor = "rgb(90%, 0%, 25%)"Значение по умолчанию: Ничего.
borderBottomStyle, borderLeftStyle, borderRightStyle, borderTopStyle
Доступ: Чтение/Изменение
Тип линии одного края границы элемента.
Пример:
document.all.announce.style.borderBottomStyle = "groove"
document.all.announce.style.borderLeftStyle = "double"
document.all.announce.style.borderRightStyle = "solid"
document.all.announce.style.borderTopStyle = "inset"Возвращаемое значение: Значения Стиля - константы без учета регистра, которые связаны со специфичными методами показа линий обрамления. CSS константы стиля: dashed, dotted, double, groove, hidden, inset, none, outset, ridge & solid. Не все броузеры признают все эти значения в CSS рекомендации.
Значение по умолчанию: Ничего.
borderBottomWidth, borderLeftWidth, borderRightWidth, borderTopWidth
Доступ: Чтение/Изменение
Ширина одного края границы элемента. См. также свойство borderWidth.
Пример:
document.all.announce.style.borderBottomWidth= "thin"
document.all.announce.style.borderLeftWidth = "thick"
document.all.announce.style.borderRightWidth = "2px"
document.all.announce.style.borderTopWidth = "0.5em"Возвращаемое значение: Три константы без учета регистра--thin | medium | thick--Позволите броузеру определять точно, сколько пикселов используются, чтобы показать границу. Для большей точности Вы можете также назначать значение длины.
Значение по умолчанию: medium
borderColor
Доступ: Чтение/Изменение
Цвет края границы
Пример:
document.all.announce.style.borderColor = "red"
document.all.announce.style.borderColor = "red green"
document.all.announce.style.borderColor = "black rgb(100, 75, 0) #c0c0c0"
document.all.announce.style.borderColor = "yellow green blue red"Возвращаемое значение: В Internet Explorer это свойство принимает один, два, три, или четыре значения цвета, в зависимости от того, сколько и какие границы Вы хотите установить с определенными цветами.
Значение по умолчанию: Цвет объекта (если установлен).
borderStyle
Доступ: Чтение/Изменение
Свойство которое позволяет Вам устанавливать один или несколько стилей границы. Для Internet Explorer Вы можете установить до 4 значений стиля (через пробел). Число значений определяет какие стороны получают назначенные цвета.
Пример:
document.all.announce.style.borderStyle = "solid"
document.all.announce.style.borderStyle = "solid double"
document.all.announce.style.borderStyle = "double groove groove double"Возвращаемое значение: Значения стиля - константы без учета регистра, связанные с определенными способами рендеринга линий обрамления. CSS константы стиля: dashed, dotted, double, groove, hidden, inset, none, outset, ridge и solid. Не все броузеры признают все значения CSS спецификации. В Internet Explorer, это свойство принимает один, два, три, или четыре значения, в зависимости от того, сколько и какие границы Вы хотите установить с определенными стилями.
Значение по умолчанию: Ничего
borderWidth
Доступ: Чтение/Изменение
Shortcut-свойство , которое позволяет Вам устанавливать ширину границы. Для Internet Explorer Вы можете установить 4 значения ширины через пробел (Навигатор 4 - свойство только для чтения). Число значений определяет, какие из сторон получат назначенные размеры.
Пример:
document.all.founderQuote.style.borderWidth = "3px 5px"Возвращаемое значение: Три константы без учета регистра--thin | medium | thick--позволяют броузеру определить точно, сколько пикселов используются для показа границы. Для большей точности Вы можете также назначать length. В Internet Explorer это свойство принимает одно, два, три, или четыре значения ширины в зависимости от того, сколько и какие границы Вы хотите установить с определенными размерами.
Значение по умолчанию: medium
clear
Доступ: Чтение/Изменение
Определяет, позволяет ли себе элемент быть отображенным в той же самой горизонтальной полосе как float элемент. Обычно рядом другой элемент имеет атрибут стиля float, установленный на left или right. Чтобы предотвратить перекрытие элементов, установите явно это свойство на ту же самую сторону (left или right). Если Вы не уверены, где могло бы происходить перекрытие, установите свойство явно на оба элемента. Элемент, чьё свойство явно установлено на значение, отличное от 0, представлен в начале строки ниже плавающего элемента.
Пример:
document.all.myDiv.style.clear = "both"Возвращаемое значение: Любая из следующих строковых констант (без учета регистра): both | left | Ничего | right.
Значение по умолчанию: Ничего
clip
Доступ: Чтение/Изменение
Определяет область отсечения элемента. Область отсечения - область слоя элемента, в которой он видим. Отсечение может не работать должным образом в Internet Explorer 4 для Macintosh.
Пример:
document.all.art2.style.clip = "rect(5px 100px 40px 0)"Возвращаемое значение: Строковой параметр без учета регистра или CSS clip атрибут, который определяет форму (rect) и позицию четырех граней относительно верхнего левого угла первоначального элемента. При определении длин для каждой стороны прямоугольника , соблюдайте по часовой стрелке порядок значений: top, right, bottom, left.
Значение по умолчанию: Ничего.
color
Доступ: Чтение/Изменение
Устанавливает приоритетный CSS атрибут цвета (текста).Можно устанавливать атрибут и для графических элементов, но все браузеры будут реализовывать это по разному.
Пример:
document.all.specialDiv.style.color = "green"Возвращаемое значение: Спецификация цвета CSS без учета регистра.
Значение по умолчанию: black
cssText
Доступ: Только чтение
Возвращает строку полного правила CSS , приложенного к элементу. Если правило включало параметры настройки атрибута стиля shorthand (типа border), компоненты для каждой из этих четырех сторон записаны по буквами. Например, если Вы устанавливаете атрибут элемента STYLE как STYLE = " border: groove red 3px", cssText возвратит:
BORDER-TOP: 3px groove red; BORDER-RIGHT: 3px groove red; BORDER-BOTTOM: 3px groove red; BORDER-LEFT: 3px groove red
Однако Вы можете назначить свойство на значение shorthand.
Пример:
document.all.block3.style.cssText = "margin: 2px; font-size: 14pt"Возвращаемое значение: Строковое значение атрибутов стиля, разграниченное точкой с запятой.
Значение по умолчанию: Ничего.
cursor
Доступ: Чтение/Изменение
Форма курсора, когда он над элементом. Точный вид курсоров зависит от операционной системы.Свойство затрагивает курсор, только когда он над текущим элементом.
Пример:
if (event.altKey) { event.sourceElement.style.cursor = "help" }Возвращаемое значение: Одна из "курсорных" строковых констант: auto | crosshair | default | e-resize | help | move | n-resize | ne-resize | nw-resize | pointer | s-resize | se-resize | sw-resize | text | wait.
Значение по умолчанию: auto
display
Доступ: Чтение/Изменение
Должен ли элемент быть представлен в документе. Когда установлено none, элемент скрыт, и окружающее содержание заполняет пространство; когда установлено на "" (или любое другое значение), элемент отображен.
Пример:
document.all.instructionDiv.style.display = ""Возвращаемое значение: Или none, или пустая строка("").
Значение по умолчанию: Ничего.
filter
Доступ: Чтение/Изменение
Устанавливает визуальный фильтр. Визуальный фильтр может применяться к элементу, чтобы произвести эффекты типа зеркального отражения , жара, тени, и многих другие. Показанный фильтр применяется к элементу, когда его видимость изменяется. Это включает эффекты типа wipes, blinds и barn doors. Свойство filter доступно в Internet Explorer 4, но не работает в версии Macintosh.
Пример:
document.all.fancy.style.filter= "dropshadow( )"Возвращаемое значение: Каждое свойство filter может иметь больше одного типа фильтра (разграничивается пробелом). Каждый тип фильтра сопровождается парой круглых скобок (), которые могут передавать параметры о поведении фильтра для текущего элемента. Параметр состоит из пары "имя/значение"
Значение по умолчанию: Ничего.
font
Доступ: Чтение/Изменение
Свойство shorthand, которое позволяет Вам устанавливать одно или более связанное с шрифтом свойство (fontFamily, fontSize, fontVariant, и fontWeight) с одним оператором присваивания "=". Список разграниченных пробелом значений (в любой последовательности) применяется к определенным свойствам шрифта, для которых значение является имеющим силу типом.
Пример:
document.all.subhead.style.font = "bolder small-caps 16pt"Возвращаемое значение: См. соответствующие свойства
Значение по умолчанию: Ничего.
fontFamily
Доступ: Чтение/Изменение
Расположенный по приоритетам список используемых шрифтов.
Пример:
document.all.subhead.style.fontFamily = "'Century Schoolbook' Times serif"Возвращаемое значение: Любое число имен шрифтов, разграниченных пробелом. Названия(имена) семейства ёмкостью в несколько слов должны быть в кавычках. Признаются универсальные названия семейств: serif | sans-serif | cursive | fantasy | monospace.
Значение по умолчанию: По умолчанию для броузера.
fontSize
Доступ: Чтение/Изменение
Размер шрифта элемента. Размер шрифта может быть установлен несколькими способами. Коллекция констант (xx-small, x-small, small, medium, large, x-large, xx-large) определяет то, что известно как абсолютные размеры.
Другие коллекции констант (larger, smaller) известны как относительные размеры.
Наконец, Вы можете устанавливать fontSize в процентах, которые основаны на размере размера шрифта родительского элемента.
Пример:
document.all.teeny.style.fontSize = "x-small"Возвращаемое значение: Значения любой из следующих категорий без учета регистра . Для абсолютного размера, одна из следующих констант : xx-small | x-small | small | medium | large | x-large | xx-large. Для относительного размера одна из следующих констант : larger | smaller.
Значение по умолчанию: Размер шрифта родительского элемента.
fontSizeAdjust
Доступ: Чтение/Изменение
Контролирует значение длины вторичного семейства шрифтов так, чтобы его символы имели ту же высоту, что и символы основного семейства шрифтов.
Пример:
document.all.teeny.style.fontSizeAdjust = "1.05"Возвращаемое значение: Любое число или none
Значение по умолчанию: none
fontStretch
Доступ: Чтение/Изменение
Контролирует ширину симвлов шрифта при отображении
Пример:
document.all.teeny.style.fontStretch = "expanded"Возвращаемое значение: Любое число или none
Значение по умолчанию: none
fontStyle
Доступ: Чтение/Изменение
Представлен ли элемент как normal, italic или oblique. Если fontFamily включает типы шрифта, помеченные как Italic и/или Oblique, установка атрибута fontStyle вызывает эти специфические типы шрифта.Но если специализированные типы шрифта не доступны в системе, normal тип шрифта обычно изначально выглядит курсивным. Страница, посланная на печать с такими параметрами настройки шрифта полагается на хорошую согласованность между клиентским компьютером и принтером, чтобы выполнить на аппаратном уровне сгенерированное курсивное начертание шрифта.
Пример:
document.all.emphasis.style.fontStyle= "italic"Возвращаемое значение: Internet Explorer 4 признает следующие строковые значения: normal | italic | oblique, но брабатывает и italic, и oblique как italic.
Значение по умолчанию: Ничего.
fontVariant
Доступ: Чтение/Изменение
Преобразует текст как нормальный/ нижний регистр
Пример:
document.all.emphasis.style.fontVariant = "small-caps"Возвращаемое значение: Любое из следующих констант (как строки): normal | small-caps.
Значение по умолчанию: normal
fontWeight
Доступ: Чтение/Изменение
Устанавливает жирность шрифта элемента. CSS обеспечивает(предусматрив ет) схему оценки жирности, которая является более градуированной, чем большинство броузеров показывает на экране, но точно настроенные жирности могут входить как параметры, когда содержание послано принтеру. Масштаб - числовая оценка от 100 до 900 в приращениях с модулем 100. Поэтому fontWeight 100 был бы наименее полужирный, который будет отображен, в то время как 900 был бы наиболее полужирный. Установка нормали (задана по умолчанию для любого шрифта) эквивалентна значению fontWeight 400; стандартная полужирная установка эквивалентна 700. Другие параметры настройки (bolder и lighter) позволяют Вам установить жирность относительно жирности родительского элемента.
Пример:
document.all.hotStuff.style.fontWeight = "bold"Возвращаемое значение: Любое из следующих постоянных значений: bold | bolder | lighter | normal | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900.
Значение по умолчанию: normal
height, width
Доступ: Чтение/Изменение
Высота и ширина (и их модули) элемента. Поскольку значения - строки, содержащие постоянные значения, Вы не можете использовать эти свойства для вычисления. См. pixelHeight, pixelWidth, posHeight, и posWidth .
Пример:
document.all.viewArea.style.height = "450px"Возвращаемое значение: Строка, состоящая из числового значения длины + "px" (когда в пикселях), или "%" (когда в процентах).
Значение по умолчанию: Ничего.
left
Доступ: Чтение/Изменение
Для отображаемых элементов, определяет позицию левого края элемента.
Для вычислений на этом значении, восстановите pixelLeft или posLeft свойства, которые возвращают подлинные числовые значения.
Пример:
document.all.blockD2.style.left = "45px"Возвращаемое значение: Строка, состоящая из числового значения длины, процента, или auto.
Значение по умолчанию: auto
letterSpacing
Доступ: Чтение/Изменение
Интервал между символами в пределах элемента.
Пример:
document.body.style.letterSpacing = "1.1em"Возвращаемое значение: Строка значения длины (с модулем меры) или normal.
Значение по умолчанию: normal
lineBreak
Доступ: Чтение/Изменение
Контролирует правило разрыва для текстового содержимого на японском языке.
Пример:
document.body.style.lineBreak = "strict"Возвращаемое значение: Константа normal|strict
Значение по умолчанию: normal
lineHeight
Доступ: Чтение/Изменение
Высота встроенного поля (поле, содержащее одну строку).
Пример:
document.all.tight.style.lineHeight = "1.1em"Возвращаемое значение: Строка значения длины (с модулем меры) или normal.
Значение по умолчанию: normal
listStyle
Доступ: Чтение/Изменение
Свойство shorthand для установки 3 свойств списка в одном операторе присваивания. Атрибуты, которые Вы явно не устанавливаете с этим атрибутом, принимают значения по умолчанию. Эти свойства определяют характеристики вида маркеров, автоматически закреплённых за пунктами списка внутри OL и UL элементов.
Пример:
document.all.itemList.style.listStyle = "square outside none"Возвращаемое значение: См. индивидуальные атрибуты listStyleType, listStylePosition, и listStyleImage. Вы можете включить один, два, или все три значения в любом порядке.
Значение по умолчанию: Ничего.
listStyleImage
Доступ: Чтение/Изменение
URL для изображения, которое должно использоваться как маркер перед пунктом списка. Поскольку этот атрибут может быть унаследован, установка (включая none) за 1 пунктом списка может отменить тот же самый атрибут или установку свойства в ее родителе.
Пример:
document.all.itemList.style.listStyleImage = "images/3DBullet.gif"Возвращаемое значение: Используйте none (как строку) чтобы отменить изображение, назначенное на родительский элемент. Иначе, снабдите любым имеющим силу полным или относительным URL к загрузочному модулю, чей тип MIME читаем броузером.
Значение по умолчанию: Ничего
listStylePosition
Доступ: Чтение/Изменение
Находится ли маркер внутри или вне (outdented) поля, содержащего пункта списка. Когда listStylePosition установлен на inside, и содержание - текст, маркер оказывается частью текстового блока. В этом случае, отступ пункта списка - как normal, но без outdented маркера.
Пример:
document.all.itemList.style.listStylePosition = "inside"Возвращаемое значение: Любое из постояных значений (как строка): inside | outside.
Значение по умолчанию: outside
listStyleType
Доступ: Чтение/Изменение
Тип маркера пункта, который будет отображен с каждым пунктом. Этот атрибут применяется, только если listStyleImage - none (или не указанный). Константы, доступные для этого атрибута, разделены на две категории. Один набор используется с UL элементами, чтобы представить заполненный круг, пустой круг или квадрат (пустой на Macintosh, заполненый на Windows); другой набор - для элементов OL, чьи пункты списка могут быть отмечены в последовательностях арабских цифр, римских цифр (верхний регистр или нижний регистр), или символов алфавита (верхний регистр или нижний регистр).
Пример:
document.all.itemList.style.listStyleType = "circle"Возвращаемое значение: Одно постоянное значение как строка, которая согласуется с типом контейнера списка. Для UL: circle | disc | square. Для OL: decimal | lower-alpha | lower-roman | upper-alpha | upper-roman. Последовательности элемента OL обработаны следующим образом: Тип Пример
decimal 1, 2, 3, ...
lower-alpha a, b, c, ...
lower-roman i, ii, iii, ...
upper-alpha A, B, C, ...
upper-roman I, II, III, ...
Значение по умолчанию: disc (для UL); decimal (для OL).
margin
Доступ: Чтение/Изменение
Свойство shortcut, которое может устанавливать размеры краёв 4 граней элемента одной инструкцией. Margin - пространство, которое простирается вне границы элемента. Чтобы обеспечить дополнительное пространство, margin освобождает пространство между смежными или вложенными элементами, (особенно теми, которые имеют набор атрибутов border). Вы можете установить 4 значения, разграниченных пробелом. Число значений определяет, какие стороны получают назначенные установки.
Пример:
document.all.logoWrapper.style.margin = "5px 8px"Возвращаемое значение: Это свойство принимает одно, два, три или четыре значения, разграниченные пробелом внутри одной строки, в зависимости от сколько и какие края Вы хотите изменить. Значения для краев могут быть: длины, проценты или auto.
Значение по умолчанию: 0
marginRight, marginTop
Доступ: Чтение/Изменение
Все четыре свойства устанавливают ширину отдельного края края элемента. Край - пространство, который простирается вне границы элемента и не рассчитывается как часть ширины элемента или высоты.
Пример:
document.all.logoWrapper.style.marginTop = "5px" document.all.navPanel.style.marginLeft = "10%"Возвращаемое значение: Значения для размеров края могут быть: значения длины, проценты от следующего наиболее близкого элемента или auto.
Значение по умолчанию: 0
overflow
Доступ: Чтение/Изменение
Как элемент должен обработать содержание, в соответствии с правилами CSS.
Пример:
document.all.myDiv.style.overflow = "scroll"Возвращаемое значение: Любая из следующих констант (как строка): auto | hidden | scroll | visible.
Значение по умолчанию: visible
padding
Доступ: Чтение/Изменение
Свойство shortcut, которое может устанавливать дополнительные размеры до четырех граней элемента с одной инструкцией.Padding - пространство , которое простирается вокруг элемента, но не включает границу, которая может быть определена для элемента. Padding подбирает фоновое изображение или цвет его элемента. Поскольку Вы добавляете дополнение к элементу, Вы увеличиваете размер видимого прямоугольника элемента без воздействия на размер блока padding. Вы можете установить 1 из 4 разграниченное пробелом, значения padding.
Пример:
document.all.logoWrapper.style.padding = "3px 5px"Возвращаемое значение: Это свойство принимает один, два, три, или четыре значения, разграниченных пробелом, внутри одной строки, в зависимости от сколько и какие границы Вы хотите, дополнить. Значения для дополнительных размеров могут быть: длины, проценты от наиболее близкого размера элемента или константа auto.
Значение по умолчанию: 0
paddingRight, paddingTop
Доступ: Чтение/Изменение
Все четыре свойства устанавливают ширину единственного(отдельного) дополнительного края элемента. - пространство Padding, который простирается между границей элемента и полем содержания.
Пример:
document.all.logoWrapper.style.paddingTop = "3px" document.all.navPanel.style.paddingLeft = "10%"Возвращаемое значение: Значения для дополнительных размеров могут быть: длины, проценты от наиболее близкого размера элемента или константа auto.
Значение по умолчанию: 0
pageBreakAfter, pageBreakBefore
Доступ: Чтение/Изменение
Определяет, как должен обработаться разрыв страниц вокруг элемента, когда документ послан на принтер. Разрывы страниц не представлены в броузере, поскольку они могут быть в программах обработки текстов.
Пример:
document.all.hardBR.style.pageBreakAfter = "always" document.all.navPanel.style.paddingLeft = "10%"Возвращаемое значение: Internet Explorer 4 признает четыре постоянных значения (как строки): always | auto | left | right.
Значение по умолчанию: auto
pixelHeight, pixelWidth
Доступ: Чтение/Изменение
Высота и ширина элемента в пикселах. Используйте эти свойства для вычисления (вместо свойств типа высоты и ширины, которые возвращают строки, включая модули).
Пример:
var midWidth = document.all.myDIV.style.pixelWidth/2Возвращаемое значение: Целое число
Значение по умолчанию: Ничего.
pixelLeft, pixelTop
Доступ: Чтение/Изменение
Для отображаемых элементов, определяет позицию left и top граней элемента (content plus left padding, border, and/or margin) относительно left и top граней следующего наиболее близкого элемента.
Пример:
document.all.myDIV.style.pixelLeft++Возвращ аемое значение: Целое число.
Значение по умолчанию: Ничего.
posHeight, posWidth
Доступ: Чтение/Изменение
Числовая высота и ширина элемента.
Пример:
document.all.myDIV.style.posWidth = 10.5Возвращаемое значение: Число с плавающей запятой.
Значение по умолчанию: Ничего.
position
Доступ: Только чтение
For positionable elements, returns the value assigned to the style sheet position attribute.
Пример:
var posType = document.all.myDIV.style.positionВозвраща мое значение: Число с плавающей запятой.
Значение по умолчанию: Ничего.
posLeft, posTop
Доступ: Чтение/Изменение
For positionable elements, define the position of the left and top edges of an element's box (content plus left padding, border, and/or margin) relative to the left and top edges of the next outermost block content container. When the element is relative-positioned, the measure is based on the left edge of the inline location of where the element would normally appear in the content. Most importantly, these properties' values are numeric and in the unit of measure set in the CSS attribute. Use these properties for calculation (including path animation) instead of the left and top properties, which store their values as strings with the unit names. All math is in the specified units. Also contrast these properties with the pixelLeft and pixelTop properties, which are integer values for pixel measures only.
Пример:
document.all.myDIV.style.posLeft = document.all.myDIV.style.posLeft + 1.5Возвращаемое значение: Число с плавающей запятой.
Значение по умолчанию: Ничего.
quotes
Доступ: Чтение/Изменение
Устанавливает символы, использующиеся в качестве кавычек.
Пример:
document.all.myText.style.quotes = "« »"Возвращаемое значение: Разделённые пробелом символы открытых и закрытых кавычек или константа none/inherit
Значение по умолчанию: inherit.
rubyAlign
Доступ: Чтение/Изменение
Устанавливает выравнивание "рубинового" текста элемента RUBY
Пример:
document.all.myText.style.rubyAlign = "distribute-letter"Возвращаемое значение: Константа auto|left|center|right|distribute-letter|distribute-space|line-edge
Значение по умолчанию: inherit.
rubyOverhang
Доступ: Чтение/Изменение
Устанавливает отступ "рубинового" текста элемента RUBY
Пример:
document.all.myText.style.rubyOverhang = "whitespace"Возвращаемое значение: Константа auto|whitespace|none
Значение по умолчанию: none.
rubyPosition
Доступ: Чтение/Изменение
Устанавливает расположение "рубинового" текста элемента RUBY относительно основного текста.
Пример:
document.all.myText.style.rubyPosition = "inline"Возвращаемое значение: Константа above|inline
Значение по умолчанию: above
styleFloat
Доступ: Чтение/Изменение
С какой стороны элемент обтекается текстом.
Пример:
document.all.myDIV.style.styleFloat = "right"Возвращаемое значение: одна из следующих констант (как строка): none | left | right.
Значение по умолчанию: Ничего.
textAlign
Доступ: Чтение/Изменение
Определяет горизонтальное выравнивание текста в пределах элемента./[I]
Пример:
document.all.myDIV.style.textAlign = "right"Возвращаемое значение: 1 из 3 констант (как строка): center | left | right.
Значение по умолчанию: left
textAlignLast
Доступ: Чтение/Изменение
[I]Определяет горизонтальное выравнивание последней строки каждого абзаца.
Пример:
document.all.myText.style.textAlign = "right"Возвращаемое значение: 1 из 4 констант (как строка): center | justify | left | right.
Значение по умолчанию: left
textAutospace
Доступ: Чтение/Изменение
Определяет дополнительные пробелы между идеографическими и не идеографическими символами.
Пример:
document.all.myText.style.textAutospace = "ideograph-alpha"Возвращаемое значение: Константа none|ideograph-alpha|ideograph-numeric|ideograph-parenthesis|ideograph-space
Значение по умолчанию: none
textDecoration
Доступ: Чтение/Изменение
Определяет добавления к текстовому содержанию элемента в форме подчеркиваний, перечёркиваний, надчёркиваний, и (в Навигаторе и CSS) мигание. Вы можете определить больше чем один стиль художественного оформления, поставляя значения в списке через пробел. В то время как Internet Explorer 4 поддерживает blink значение, это не мигающий текст. Текстовое художественное оформление имеет необычные родительские-дочерние отношения. Значения не наследуются, но эффект художественного оформления передается ко вложенным элементам. Поэтому, если иначе не переопределено, подчеркнутый P элемент подчеркивает вложенный B элемент. Internet Explorer также включает свойства для каждого типа художественного оформления.
Пример:
document.all.emphasis.style.textDecoration = "underline"Возвращаемое значение: В дополнение к none, любая из следующих 4 констант (как строка): blink | line-through | overline | underline. Множественные значения могут быть включены в строку как список, разграниченный пробелом.
Значение по умолчанию: Ничего.
textDecoration, textDecorationBlink, textDecorationLineThrough, textDecorationNone, textDecorationOverline, textDecorationUnderline
Доступ: Чтение/Изменение
Определено ли всё вышеперечисленное для указанного текстового элемента.
Пример:
document.all.emphasis.style.textDecorationLineThro ugh = "true"Возвращаемое значение: Булево значение: true | false.
Значение по умолчанию: false
textIndent
Доступ: Чтение/Изменение
Размер выравнивания первой строки блока встроенного текста (типа P элемента). Только на первую строку воздействует эта установка.
Пример:
document.all.firstGraph.style.textIndent = "0.5em"Возвращаемое значение: Строковое значение, состоящее из номера и меры.
Значение по умолчанию: Ничего
textJustify
Доступ: Чтение/Изменение
Контролирует дополнительные отступы для элемента, свойство textAlign которого равно Justify
Пример:
document.all.firstGraph.style.textJustify = "distribute"Возвращаемое значение: Одна из констант: Auto|distribute|distribute-all-lines| distribute-center-last|inter-cluster|inter-ideograph|inter-word|kashida|newspaper
Значение по умолчанию: Ничего
textJustifyTrim
Доступ: Чтение/Изменение
Для использования в будущем
textKashidaSpace
Доступ: Чтение/Изменение
Контролирует соотношение расширения протяжки и расширения пробелов для арабских систем письма
Пример:
ссылка_на_элемент.style.textKashida Space = "90%"Возвращаемое значение: Процентное соотношение
Значение по умолчанию: Ничего.
textShadow
Доступ: Чтение/Изменение
Контролирует отображение тени вокруг элементов текста. Атрибут стиля для этого свойства не поддерживается в IE5/Mac и NN6, однако данное свойство присуще объекту style.
Возвращаемое значение: Каждая спецификация тени состоит из цвета по выбору и 3 разделённых пробелами значений длины (горизонтальное смещение тени, вертикальное смещение тени, радиус тени). Множественные значения разделяются запятыми.
Значение по умолчанию: Ничего.
textTransform
Доступ: Чтение/Изменение
Управляет преобразованием букв текста элемента в прописные.
Пример:
document.all.heading.style.textTransform = "capitalize"Возвращаемое значение: Значение none позволяет регистру исходного текста быть представленным как есть. Другие доступные постоянные значения (как строки): capitalize | lowercase | uppercase.
Значение по умолчанию: Ничего.
textUnderlinePosition
Доступ: Чтение/Изменение
Расположение линии в подчёркнутом начертании - над текстом или под текстом
Пример:
ссылка_на_элемент.style.textUnderli nePosition = "above"Возвращаемое значение: Константа above|below
Значение по умолчанию: Ничего.
top
Доступ: Чтение/Изменение
Для отображаемых элементов, определяет позицию высшего края поля элемента (содержание плюс top padding, border, и/или margin) относительно высшего края следующего наиболее близкого элемента.
Для вычислений на этом значении, отыщите pixelTop или posTop свойства, которые возвращают подлинные числовые значения.
Пример:
document.all.blockD2.style.top = "40px"Возвращаемое значение: Строка, состоящая из числового значения и меры длины, процента, или auto.
Значение по умолчанию: auto
unicodeBidi
Доступ: Чтение/Изменение
В двунаправленом тексте - насколько блок текста, направленный в противоположную сторону, вложен во внешний элемент.
Пример:
ссылка_на_элемент.style.unicodeBidi = "normal"Возвращаемое значение: Константа normal|embed|bidi-override
Значение по умолчанию: normal.
verticalAlign
Доступ: Чтение/Изменение
Характеристика вертикального выравнивания элемента.
Пример:
document.all.myDIV.style.verticalAlign = "text-top"Возвращаемое значение: Строковое значение абсолютной меры (с модулями), процент (относительно следующего внешнего элемента поля), или одно из следующих постоянных значений: bottom | top | baseline | middle | sub | super | text-bottom | text-top.
Значение по умолчанию: baseline
visibility
Доступ: Чтение/Изменение
Видимость элемента. Окружение содержания не закрывает левый пробел элемента, чьё свойство видимости установлено в hidden.
Пример:
document.all.myDIV.style.visibility = "hidden"Возвращаемое значение: Одно из постоянных значений (как строка): hidden | inherit | visible.
Значение по умолчанию: inherit
whiteSpace
Доступ: Чтение/Изменение
Контролирует интерпретацию символов пробела в коде источника элемента
Пример:
ссылка_на_элемент.style.whiteSpace = "nowrap"Возвращаемое значение: Константа normal|nowrap|pre
Значение по умолчанию: normal
wordBreak
Доступ: Чтение/Изменение
Контролирует характеристики разрыва слова, содержащего как латинские, так и азиатские символы
Пример:
ссылка_на_элемент.style.wordBreak = "normal"Возвращаемое значение: Константа normal|break-all|keep-all
Значение по умолчанию: normal
wordSpacing
Доступ: Чтение/Изменение
Контролирует расстояние между словами
Пример:
ссылка_на_элемент.style.wordSpacing = "normal"Возвращаемое значение: Константа normal или длина в единицах em
Значение по умолчанию: normal
wordWrap
Доступ: Чтение/Изменение
Контролирует характеристики перехода слова на новую строку в ьлоковом элементе текста, элементе с внутренне определёнными размерами или позиционируемом элементе
Пример:
ссылка_на_элемент.style.wordWrap = "normal"Возвращаемое значение: Константа normal|break-word
Значение по умолчанию: normal
writingMode
Доступ: Чтение/Изменение
Контролирует направление потока содержимого web-страницы (слева-направо/сверху-вниз или сверху-вниз/справа-налево, как в некоторых азиатских языках)
Пример:
ссылка_на_элемент.style.writingMode = "tb-rl"Возвращаемое значение: Константа lr-tb|tb-rl
Значение по умолчанию: lr-tb
zIndex
Доступ: Чтение/Изменение
Положение в списке относительно других элементов в пределах того же самого родительского контейнера.
Пример:
document.all.myDIV.style.zIndex = 3Возвращаемое значение: Целое число.
Значение по умолчанию: 0
Shadow_p1raT
16.08.2008, 12:14
--:[ Название : Socks5 изучение продолжается:BIND ]:--
--:[ Автор : Jinn, ZaeB.uS, _http://zaeb.us ]:--
o--:[ 1 | Введение ]:--o
Вот решил написать еще одну статью на тему соксов, некоторые личности скажут:"Вот понаписал статей, мог бы все в одной изложить!", объясню мою точку зрения на данную проблему: я считаю, что если бы весь этот материал(с первой статьи по текущую) содержался в одной статье, то статья бы получилась довольно большой и сложной для понимания! В этот раз рассмотрим метод не connect как в прошлых статьях, а bind. Если вы первый раз читаете про соксы и не знакомы с этим протоколом, то желательно прочитать мои статьи:"Организация работы php скрипта через socks5 сервер","PHP + socks5(авторизация по методу username/password)", либо RFC. Как и в прошлые разы перечислю на чем я все это гонял,ничего не изменилось=):
* Win XP SP2
* Opera 8.52
* Денвер
* 3proxy-0.5.3i(ЗАРАЗА)
o--:[ 2 | Общие принципы ]:--o
Для тех кто не знаком что это такое отправлю в гугл и коротко обьясню=) Bind используется для открытия порта, а по теме этой статьи видно что мы рассматриваем сокс => открывать порт будем на стороне socks5-сервера. А для чего это нужно? Это может использоваться в соединениях, которые требуют открытия порта на стороне клиента(мы ведь прячемся за сокс, т.е для удаленного сервера клиентом является сокс), хорошим примером требующим открытия порта на стороне клиента является ftp. Я думаю многие видели вопросы на форумах типа: "Ftp клиент не работает с http проксей", после долгой дискуссии выяснялось, что хлопчик пытается подключиться к фтп серверу через http проксю в активном режиме. И соответствующий ответ: "Юзай пассивный режим!". А что же это такое активный и пассивный режим? Если кто изучал ftp протокол те знаю, что в нем используется 2 вида соединения: клиент--->сервер по которому идут команды клиента и сервер--->клиент:альтернативный порт, который используется для передачи результата команды клиента(ls,get,put). Но вот проблема: с htpps проксями же такое не пройдет... Мы ведь не можем открыть порт на стороне https прокси, а для передачи данных его открыть нужно. Именно поэтому при использовании прокси сервера и активного режима вы не получите листинг директории,etc. Тогда приходиться юзать пассивный режим, там все открытия порта происходят на стороне ftp-сервера, а клиент из-за прокси просто к ним подключается и получает ответы на команды =) Но в соксах все по другому, тут есть механизм открытия порта на стороне сокс сервера и называется он bind. Т.е при использовании сокса не нужно переходить в пассивный режим(хотя возможно :-), но нужно тоже постараться чтобы открыть порт на соксе, а именно изучить данную небольшую статью =)
o--:[ 3 | Реализуем BIND ]:--o
Для чего это нужно разобрались, перейдем к практике и попробуем написать работающие приложение :-)
По RFC предполагается, что bind будет использован только как вторичное соединение, после первого первичного установленного с помощью метода CONNECT, но мы в наших экспериментах нарушим предписания RFC.
Пакеты для бинда порта мы должны слать такие же как и для коннекта, но метод должен быть не connect(01) а bind(02)=). Снова показывать структуру пакета я не буду, если ты ее не знаешь читай статьи [1],[2]. На connect сокс сервером возвращается один ответ, в котором указан статус(ok/error) подключения, с bind'ом все сложнее, соксом предоставляется 2 ответа: первый приходит сразу же после запроса, в нем так же указан статус успешности открытия порта для входящего соединения,а также ip и порт выделенные соксом для входящего соединения, эта информация, в случае надобности, может быть предоставлена серверу-приложению через первичное соединение как адрес для взаимодействия. Возможно что ip будет отличаться от ip сокс сервера, т.к иногда подобные сервера имеют несколько адресов. Второй пакет приходит после внешнего подключения к забинденому порту, там содержится ip и порт подключившегося хоста и статус подключения(коды те же, 0-ok,etc). Эти данные могут быть использованы для решения о дальнейшем взаимодействии(напрмиер ip подключившегося хоста содержится в черных списках, тогда соединение может быть разорвано....но это все на ваше усмотрение)
В принципе никакой сложности это вызывать не должно, после того как мы забиндим порт и получим первый ответ сокса, перед получением данных от подключившегося клиента мы должны будем получить второй пакет и проверять его статус, далее же, если все в порядке, мы сможем получать, отправлять данные как и прежде методами php(fread,fgets,fwrite,feof).
Теперь собственно обсудим что мы будем кодить. Мы не будем работать с ftp и вот почему: в php существуют ф-ции ftp_connect, ftp_put, etc. Но при подключении сначала к соксу а потом попытке передачи через данный сокет файла данными методами определенными для работы с ftp компилятор php верещит, что сокет не подходит => воспользоваться встроенными ф-циями работы с ftp сервером нам не удастся и придется изучать и писать свой класс для работы по протоколу ftp, а это не так то просто и не входит в мои планы....пока=) Но ведь наша цель просто открыть на соксе порт, и получить оттуда отправленные сервером данные, поэтому мы поступим вот как:
-- забиндим порт на соксе
-- получим ответ сокса, со статусом открытия порта, ip и порт выделенный для входящих подключений
[ Мы за сервер ]
-- теперь поработает за сервер и откроем подлючение не используя сокса(хм..хотя никто вам не мешает это сделать) с помощью fsockopen и выделенным адресом для входящего подключения
-- отправим туда произвольные данные
-- закроем подключение
[ сервер накрылся медным тазом ]
-- теперь мы получим пакет от сокса, в котором указаны ip и порт подключившегося хоста(т.е нашего)
-- опять получим данные, уже отправленные сервером(опять нами;-)
-- закроем подлючение к соксу
-- выведем все это пользователю
Этим примером мы проверим правильность понимания нами протокола, как мне кажется, данный пример полностью показывает все стороны bind'а, как клиентской стороны так и серверной :-)
Обсудим особенности нашего сегодняшнего кода.
Обычно сокс сервер формирует ответ с типом адреса 01, т.е ip адрес, а не так как мы 03 - доменное имя. Для перевода ip в привычный нам строковый вид, т.е с точками мы будем использовать функцию пхп long2ip, специального для этого предназначенную, но перед этим мы должны будем перевести адрес из hex'а в dec. Кстати существует функция ip2long, которая могла бы пригодиться нам в том случае если бы мы передавали соксу IPv4,но это просто на заметку :-)
Код изначально взят из моей статьи [2] и заточен именно для bind'а...
<?
error_reporting(0);
$socks_ip = "127.0.0.1"; // адрес scoks 5 прокси
$socks_port = 1080; // порт сокса
$socks_login = "jinn"; // логин для доступа к соксу
$socks_pass = "jinn2"; // пароль
$bind_host = "127.0.0.1";
$bind_port = 3232;
$socks_server=fsockopen($socks_ip,$socks_port); // соединяемся с соксом
if($socks_server)
{
echo'<meta http-equiv="Content-Language" content="ru"><meta http-equiv=Content-Type content="text/html; charset=windows-1251">';
$h=pack("H*",'05020002'); // привествие =)
fwrite($socks_server,$h);
$result=bin2hex(fread($socks_server,4)); // переводим в hex для дальнейшего сравнения
if($result == '0500') // авторизация отсутствует
{
$auth_ok=1;
}
elseif($result == '0502') // метод username/password
{
$len_login = chr(strlen($socks_login)); //получаем спец символ соответсвующий ascii коду
$len_pass = chr(strlen($socks_pass)); // получаем спец символ соответсвующий ascii коду
$h=pack("H*","01").$len_login.$socks_login.$len_pass.$socks_pass; // формируем пакет с помощью pack()
fwrite($socks_server,$h);
$result=bin2hex(fread($socks_server,4)); // переводим из бинарного режима в hex
// далее сверяем если код ответа 0, то авторизация успешна,выставляем об этом переменую,в ином случа выводим сообщение об ошибке
if($result{3}!=0)
{
echo "<center><font color=red>Ошибка:аутентификация не прошла!</font></center>";
fclose($socks_server);
}
else
{
$auth_ok=1;
}
}
else
{
echo "<center><font color=red>Ошибка:возможно это не socks5 или он не поддерживает данные(00,02) методы аутентификации!</font></center>";
}
$list="";
// проверяем если авторизация успешна , то начинаем взаимодействие с соксом
if($auth_ok==1)
{
$len_h=chr(strlen($bind_host));
$h=pack("H*","05020003").$len_h.$bind_host.pack("n",$bind_port); //формируем запрос
fwrite($socks_server,$h);
$result = bin2hex(fread($socks_server,1024));
$ver = substr($result,0,2);
$status = substr($result,2,2);
$in_ip = long2ip(hexdec(substr($result,8,8)));
$in_port = hexdec(substr($result,16,4));
echo "Адрес для подключения:".$in_ip.":".$in_port."<br>";
// проверяем успешность подключения,выводи ошибки
if($status == '00')
{
$head = "<br><br><center><font color='blue' size=4>HI!coded by ZaeB.uS</font></center>";
$in_socket=fsockopen($in_ip,$in_port);
fwrite($in_socket,$head);
fclose($in_socket);
$result = bin2hex(fread($socks_server,1024));
$ver = substr($result,0,2);
$status = substr($result,2,2); // тут статус входящего подключения
$con_ip = long2ip(hexdec(substr($result,8,8))); // а кто это к нам подключился?ип подключившегося хоста
$con_port = hexdec(substr($result,16,4)); // порт негодяя
echo "Подключившийся хост:".$con_ip.":".$con_port."<br>";
echo "Полученные данные<br><br>";
// получаем данные
while(!feof($socks_server))
{
echo fread($socks_server,1024);
}
}
// определяем ошибку! данные коды ответа взяты из RFC
elseif ($status == 1) {echo "<center><font color=red>Ошибка: вина SOCKS-сервера</font></center>";}
elseif ($status == 2) {echo "<center><font color=red>Ошибка: соединение запрещено набором правил</font></center>";}
elseif ($status == 3) {echo "<center><font color=red>Ошибка: сеть недоступна</font></center>";}
elseif ($status == 4) {echo "<center><font color=red>Ошибка: хост недоступен</font></center>";}
elseif ($status == 5) {echo "<center><font color=red>Ошибка: отказ в соединении</font></center>";}
elseif ($status == 6) {echo "<center><font color=red>Ошибка: истечение TTL</font></center>";}
elseif ($status == 7) {echo "<center><font color=red>Ошибка: команда не поддерживается</font></center>";}
elseif ($status == 8) {echo "<center><font color=red>Ошибка: тип адреса не поддерживается</font></center>";}
else {echo "<center><font color=red>Ошибка: не определено!RFC в панике! :-)</font></center>";}
}
fclose($socks_server);
}
else
{
echo "<center><font color=red>SOCKS сервер недоступен!</font></center>";
}
echo '<br><br><table border="0" cellspacing="1" width="100%" align="center" style="background-color:#000000;"><tr><td width="100%" align="center" style="background-color:#E8E8E8;"><font size=1 color="#292929" face="verdana">[ c0ded by <b>Jinn</b> | 304227033 | http://zaeb.us ] </font></td></tr></table>';
?>
o--:[ 4 | End ]:--o
Да, статья получилась не слишком большой, и возможно вы не узнали из нее ничего нового, но все же я думаю что знать данную инфу нужно, ведь понимание сетевых протоколов является основным=) По прежнему, если возникли предложения или вопросы стучи мне в асю или пиши на мыло, постараюсь дать ответ...
o--:[ 5 | Материалы ]:--o
1.... Организация работы php скрипта через socks5 сервер, Jinn, ZaeB.uS, _http://zaeb.us
2.... PHP + socks5(авторизация по методу username/password), Jinn, ZaeB.uS, _http://zaeb.us
o--:[ Jinn | ZaeB.uS | _http://zaeb.us ]:--o
Alekzzzander
28.08.2008, 14:35
Здесь представлен обзор 38 статей, разбитых на 4 категории по способам реализации.
Простой, семантически правильный CSS блок с чистым кодом
Создает блок и добавляет возможность создания заголовка блока. Тянется по ширине и высоте. Несмотря на тень на примере, реализации полупрозрачной тени не предусмотрено.
<div class="sidebox">
<div class="boxhead"><h2>Test Headline</h2></div>
<div class="boxbody">
<p>This is a short sample paragraph.</p>
<p>And another one.</p>
</div>
</div>
The CSS:
/* Show only to IE PC \*/
* html .boxhead h2 {height: 1%;} /* For IE 5 PC */
.sidebox {
margin: 0 auto; /* center for now */
width: 17em; /* ems so it will grow */
background: url(sbbody-r.gif) no-repeat bottom right;
font-size: 100%;
}
.boxhead {
background: url(sbhead-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxhead h2 {
background: url(sbhead-l.gif) no-repeat top left;
margin: 0;
padding: 22px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
text-shadow: rgba(0,0,0,.4) 0px 2px 5px; /* Safari-only, but cool */
}
.boxbody {
background: url(sbbody-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
}
http://vremenno.net/files/uploads/corners/1.gif
Круглые углы в CSS
Очень приятный внешний вид, простая реализация, малое количество HTML-элементов. К минусам, пожалуй, можно отнести только наличие 4 картинок для каждого из углов. Но увы не работает в IE.
Используемые изображения:
http://virtuelvis.com/gallery/css/rounded/top-left.png http://virtuelvis.com/gallery/css/rounded/top-right.png http://virtuelvis.com/gallery/css/rounded/bottom-left.png http://virtuelvis.com/gallery/css/rounded/bottom-right.png
Верхние левые и верхние правые углы созданы, используя следующее правило CSS:
.rounded:before {
background: transparent url(top-right.png) scroll no-repeat top right;
margin-bottom: -20px;
height: 30px;
display: block;
border: none;
content: url(top-left.png);
padding: 0;
line-height: 0.1;
font-size: 1px;
}
Нижние левые, и нижние правые углы созданы с подобным правилом, только используя :after псевдо элемент:
.rounded:after {
display: block;
line-height: 0.1;
font-size: 1px;
content: url(bottom-left.png);
margin: 0 0 -1px 0;
height: 30px;
background: white;
background: transparent url(bottom-right.png) scroll no-repeat bottom right ;
padding: 0;
}
http://vremenno.net/files/uploads/corners/2.gif
CSS тизер-блок
Предусмотрена реализация как одно- так и двух-картиночного метода. Малое количество HTML-элементов. Очень удобно для создания тизеров.
.teaser {
width:430px;
padding:0 0 14px 0;
margin:10px auto;
background:url("tsr.gif") bottom left no-repeat;
}
tsr.gif (http://www.456bereastreet.com/lab/teaser/tsr.gif)
http://vremenno.net/files/uploads/corners/3.gif
Ссылки на последние новости
Очень интересное решение на основе неупорядоченного списка. Плюсом будет простая реализация и малое количество HTML-элементов. Приятное оформление с функцией изменения цвета при наведении мышкой (но эта приятность не работает в IE).
<style type="text/css" media="screen,print">
html,body {
margin:0;
padding:0;
color:#000;
background:#fff;
}
body {
padding:10px;
font:76%/140% "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
}
#labfooter {
text-align:center;
clear:both;
}
#news {
margin:1em auto;
padding:0;
width:150px;
font-size:0.94em;
list-style:none;
}
#news li {
background:url("box.gif") 0 100% no-repeat;
padding:0 0 4px 0;
margin:8px 0 0 0;
display:block;
}
#news li p {
background:#eaeaea;
padding:1px 4px 0 7px;
margin:0;
border-left:14px solid #939393;
}
#news li.arr p {
background:#eaeaea url("edge.gif") 0 50% repeat-y;
padding-left:21px;
border:0;
}
#news h4 {
font-size:1em;
line-height:1em;
font-weight:bold;
background:url("box.gif") 0 0 no-repeat;
margin:0;
padding:6px 4px 3px 21px;
}
#news li:hover {
background-position:-150px 100%;
}
#news li:hover p {
border-color:#2793ff;
}
#news li.arr:hover p {
background-image:url("edge-h.gif");
}
#news li:hover h4 {
background-position:-150px 0;
}
#news a:link {
text-decoration:none;
color:#000;
}
#news a:visited {
text-decoration:none;
color:#606;
}
#news a:hover {
text-decoration:underline;
}
#news .more {
line-height:1em;
display:block;
text-align:right;
padding:0 18px 2px 21px;
margin-top:4px;
background:url("arrow.gif") 135px 50% no-repeat;
}
</style>
<ul id="news">
<li>
<h4><a href="#">News Item 1</a></h4>
<p>Nulla dictum. Praesent turpis libero, pretium in, pretium ac, malesuada sed, ligula.</p>
<a href="#" class="more" title="Continue reading News Item 1">Read more</a>
</li>
<li>
<h4><a href="#">News Item 2</a></h4>
<p>Nullam adipiscing dui blandit ipsum.</p>
<a href="#" class="more" title="Continue reading News Item 2">Read more</a>
</li>
<li class="arr">
<h4><a href="#">News Item 3</a></h4>
<p>Vivamus convallis tempus ante.</p>
<a href="#" class="more" title="Continue reading News Item 3">Read more</a>
</li>
<li class="arr">
<h4><a href="#">News Item 4</a></h4>
<p>Vivamus convallis tempus ante. Nullam adipiscing dui blandit ipsum.</p>
<a href="#" class="more" title="Continue reading News Item 4">Read more</a>
</li>
</ul>
box.gif (http://www.456bereastreet.com/lab/newslist/box.gif) edge.gif (http://www.456bereastreet.com/lab/newslist/edge.gif) edge-h.gif (http://www.456bereastreet.com/lab/newslist/edge-h.gif)
http://vremenno.net/files/uploads/corners/4.gif
CSS и круглые углы: Границы с дугами
Неоспоримым минусом является наличие 8 дивов для реализации. Так же в статье есть описание другого метода, в котором используется в 2 раза меньше дивов, но блок залит цветом.
<style type="text/css">
.b {background: url(dot.gif) 0 100% repeat-x}
.l {background: url(dot.gif) 0 0 repeat-y}
.r {background: url(dot.gif) 100% 0 repeat-y}
</style>
<div class="t"><div class="b"><div class="l"><div class="r"><div class="bl"><div class="br"><div class="tl"><div class="tr">
Lorem ipsum dolor sit amet consectetur adipisicing elit
</div></div></div></div></div></div></div></div>
http://vremenno.net/files/uploads/corners/5.gif
Создание скругленного блока или дизайн с CSS и XHTML
Как и в предыдущем способе все реализовано на основе списка определений. В статье рассмотрено два способа реализации. Так же появилась возможность тянущейся ширины.
css
dl { /* block position that can be changed at will */
position: absolute;
left: 50px;
top: 20px;
width: 275px; /* width of block according to your background image */
}
dl, dt, dd { /* suppression of all margins and paddings */
margin: 0;
padding: 0;
}
dl { /* by default background on the entire block */
background: url(bas.gif) bottom left no-repeat;
padding-bottom: 40px; /* so that text will not appear on the bottom rounded edge */
}
dt { /* bloc title definition */
height: 40px;
background: url(haut.gif) top left no-repeat;
font-size: 1.3em;
font-weight: bold;
text-align: center;
}
dd {
padding: 0 20px 0 10px; /* internal block spaces administration */
text-align: justify;
background: url(milieu.gif) top left repeat-y; /* internal background */
}
html
<body>
<dl>
<dt>My beautiful space</dt>
<dd>Lorem ipsum dolor sit amet, bla bla bla bla...</dd>
</dl>
</body>
http://vremenno.net/files/uploads/corners/7.gif
«Пуленепробиваемые» круглые углы
Очень подробная статья с большим количеством примеров. Но достаточно сложная реализация. К тому же используется 4 картинки.
HTML:
<div class="contentWrapper">
<div class="content">
<img class="borderTL" src="/images/borderTL.gif" alt="" width="14" height="14" />
<img class="borderTR" src="/images/borderTR.gif" alt="" width="14" height="14" />
<h1>Here be content!</h1>
<!-- IE5/win puts the margin-bottom of the content div's final element
OUTSIDE the containing box (div.content), instead of putting it inside
the containing box's edge. So it needs this spacer. -->
<div class="roundedCornerSpacer"> </div>
</div><!-- end of div.content -->
<div class="bottomCorners">
<img class="borderBL" src="/images/borderBL.gif" alt="" width="14" height="14" />
<img class="borderBR" src="/images/borderBR.gif" alt="" width="14" height="14" />
</div>
</div><!-- end of div.contentWrapper -->
CSS:
.roundedCornerSpacer {
margin: 0px; padding: 0px; border: 0px;
clear: both;
font-size: 1px; line-height: 1px;
}
/* In the CSS below, the numbers used are the following:
1px: the width of the border
3px: a fudge factor needed for IE5/win (see below)
4px: the width of the border (1px) plus the 3px IE5/win fudge factor
14px: the width or height of the border image
*/
.borderTL, .borderTR, .borderBL, .borderBR {
width: 14px; height: 14px;
padding: 0px; border: 0px;
z-index: 99;
}
.borderTL, .borderBL { float: left; clear: both; }
.borderTR, .borderBR { float: right; clear: right; }
.borderTL { margin: -1px 0px 0px -1px; }
.borderTR { margin: -1px -1px 0px 0px; }
.borderBL { margin: -14px 0px 0px 0px; }
.borderBR { margin: -14px 0px 0px 0px; }
/* IE5-5.5/win needs the border scooted to the left or right by an
additional 3px! Why? */
.borderTL {
margin-left: -4px;
ma\rgin-left: -1px;
}
html>body .borderTL {
margin-left: -1px;
}
.borderTR {
margin-right: -4px;
ma\rgin-right: -1px;
}
html>body .borderTR {
margin-right: -1px;
}
.borderBL {
margin-left: -3px;
ma\rgin-left: 0px;
}
html>body .borderBL {
margin-left: 0px;
}
.borderBR {
margin-right: -3px;
ma\rgin-right: 0px;
}
html>body .borderBR {
margin-right: 0px;
}
/* To get around a known bug in IE5/win, apply the
border (no margin, padding or positioning) to the
content class and apply whatever positioning you
want to the contentWrapper class. */
.content {
margin: 0px;
padding: 0px;
border: 1px solid #000000;
}
.contentWrapper {
/* position this div however you want, but
keep its padding and border at zero */
padding: 0px;
border: 0px;
}
Рисование теней и рамок элементов оформления
Статья Владимира Токмакова. Весьма сложная реализация, но к плюсам, конечно, относится возможность создания полупрозрачных теней. Статья на русском.
<style type="text/css">
.framed,
.framed .f_r,
.framed .f_b,
.framed .f_l,
.framed .f_c
{
float: left;
position: relative; z-index: 1;
width: auto; height: auto;
margin: 0; padding: 0;
}
.framed .f_tt,
.framed .f_rr,
.framed .f_bb,
.framed .f_ll
{
display: none;
}
.framed
{
margin: 0 30px 15px 0;
background: url('hint-t.png') no-repeat left top;
//background: none;
}
.framed .f_r
{
left: 30px;
background: url('hint-r.png') no-repeat right top;
//background: none;
}
.framed .f_b
{
top: 30px;
background: url('hint-b.png') no-repeat right bottom;
//background: none;
}
.framed .f_c
{
float: none;
position: relative;
left: 30px; top: -15px;
padding: 1px 0; margin: 0 30px 0 0;
background: #fffcb8;
}
.framed .f_l
{
left: -30px;
padding: 15px 0;
background: url('hint-l.png') no-repeat left bottom;
//background: none;
}
* html .framed .f_r,
* html .framed .f_b,
* html .framed .f_l
{ height: 0; }
* html .framed .f_tt,
* html .framed .f_rr,
* html .framed .f_bb,
* html .framed .f_bb *,
* html .framed .f_ll,
* html .framed .f_ll *
{
display: block;
position: absolute;
left: 0; top: 0;
}
* html .framed .f_tt
{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src=hint-t.png,sizingMethod=crop);
}
* html .framed .f_rr
{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src=hint-r.png,sizingMethod=crop);
}
* html .framed .f_tt,
* html .framed .f_bb
{
width: expression( parentNode.offsetWidth ); height: 30px;
}
* html .framed .f_rr,
* html .framed .f_ll
{
width: 30px; height: expression( parentNode.offsetHeight );
}
* html .framed .f_bb,
* html .framed .f_ll
{
overflow: hidden;
}
* html .framed .f_bb *
{
width: 3000px; height: 30px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src=hint-b.png,sizingMethod=crop);
}
* html .framed .f_ll *
{
width: 30px; height: 3000px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src=hint-l.png,sizingMethod=crop);
}
/* Исправляем неправильный расчет позиции при "нечетной ширине" */
* html .framed .f_rr,
* html .framed .f_bb *
{ right: expression( this.parentNode.offsetWidth % 2 ? -1 : 0 ); left: auto; }
* html .framed .f_ll,
* html .framed .f_ll *,
* html .framed .f_bb,
* html .framed .f_bb *
{ bottom: expression( this.parentNode.offsetHeight % 2 ? -1 : 0 ); top: auto; }
</style>
<div style="position: relative; height: 7em;">
<p>Любой текст, поверх которого показывается элемент.</p>
<div class="framed" style="position: absolute; left: 6em; top: 0.5em;">
<div class="f_tt"></div>
<div class="f_r"><div class="f_rr"></div>
<div class="f_b"><div class="f_bb"><div></div></div>
<div class="f_l"><div class="f_ll"><div></div></div>
<div class="f_c">
Сообщение или форма ввода данных.
</div>
</div>
</div>
</div>
</div>
</div>
http://vremenno.net/files/uploads/corners/13.gif
Верстаем без таблиц!
Вот пример, работающий во всех броузерах, в том числе и в IE5
Стандартная страничка с хидером, меню, контентом и футером (футер всегда внизу ;) ):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Верстаем без таблиц</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<style type="text/css">
* {padding: 0; margin: 0; font: normal 100.1% 'Times New Roman'}
body {min-height: 100%; height: 100%; color: #000; background: url('bg.gif') 30% 0 repeat-y}
html {height: 100%}
body, html, #root {min-width: 600px}
H3 {font: bold 25px Arial; color: #888}
#nav H3, #content H3 {margin: 0 0 5px 0}
#root {height: auto; width: 100%; min-height: 100%}
#head {background: #e4e4e4; height: 68px}
#nav {float: left; width: 30%}
#nav P A {background: #e9e9e9; color: #444; border: 1px solid #333; font: bold 90% Georgia; text-decoration: none; display: block; width: 100%; margin: 1px auto}
#content {float: right; width: 70%}
#footer, #wrapper {clear: both; height: 50px}
#footer {background: #e4e4e4; z-index: 9999; margin: -50px 0 0 0}
</style>
<!--[if lt IE 7]>
<style type='text/css'>
#root {height: 100%}
#nav {margin-right: -100%}
#content {margin-left: 30%; display: inline}
#nav, #content {z-index: 1; padding: 0 0 50px 0}
</style>
<![endif]-->
</head>
<body>
<div id='root'>
<div id='head'>
<h3>Header</h3>
</div>
<div id='content'>
<h3>Content</h3>
</div>
<div id='nav'>
<h3>Navigation</h3>
</div>
<div id='wrapper'>
</div>
</div>
<div id='footer'>
<h3>Footer</h3>
</div>
</body>
</html>
Дерзайте! ;)
Design_Corn
12.01.2009, 02:17
Введение
Приветствую, и сразу начнём ;). В этой статье мы напишем простенький демон на php, но для начала нам надо ознакомиться с сокетами и базовыми знаниями IP-протокола. Итак что же представляет собой сокет? Сокет - это программный интерфейс, предназначенный для передачи данных между приложениями на сетевом уровне. В PHP есть функции работающие с сокетами на уровне IP-протокола. Это гораздо более низкий уровень по сранению с уровнем, на котором работают функция fsockopen и потоки. В этой статье я научу тех, кто пока ещё не умеет работать с этими функциями. Работать будем в режиме CLI (command-line interface) т.е в коммандной строке, а не через браузер.
Что для этого нам понадобиться:
PHP интерпретатор - ну куда ж без него :). Кстати вебсервер apache или какой другой нам не понадобиться!
php_sockets.dll - библиотека (должна быть именно под вашу версию PHP)
Подключение модуля sockets
Для начала нам нужно проверить подключена ли у нас либа php_sockets.dll. Смотрим в php.ini (eg. %WINDIR%\php.ini) и смотрим в раздел "Dynamic Extensions". Там должна быть раскоментирована строчка "extension=php_sockets.dll". Далее смотрим директиву "extension_dir" она должна указывать на путь где лежат все динамически подключаемые модули. Лезем туда и смотрим присутсвует ли библиотека там. Если да то читаем дальше, если нет то скачайте модуль под вашу версию php и положите в эту директорию. Теперь проверим работает ли она. Существует несколько способов проверить это.
Из командной строки запустить php.exe с ключом -m. (php.exe -m);
Скрипт запустить и посмотреть существует ли раздел "sockets";
На хостинге (где у вас нету доступа к php.ini и ssh) можно проверить скриптом:
<?php
print "php_sockets.dll - ";
if(extension_loaded('sockets'))
{
print "loaded";
} else {
print "not loaded";
}
?>
Если у вас не подключена php_sockets.dll то смысла читать ниже - нету.
Пишем простой демон
Итак напишем простой демон который будет при подключении выводить какую нибудь рандомную надпись из файла. Принцип сервера-скрипта будет простой:
Создаём TCP сокет;
Привязываем сокет к определённому адресу и порту;
Слушаем сокет;
Клиент конектится, выводим рандомную фразу. Ждём до того пока не он не пошлёт комманду "bye".
Приступим к кодингу, думаю вопросов лишний не возникнет так-как код хорошо комментирован.
<?php
// Файл содержащий рандомные фразы разделённых "\r\n" (каждая фраза на новой строке)
$FileName = "file.txt";
$FHandle = file($FileName);
// Работаем вечно (выдаёт ошибку при safe_mode=1, @ для подавления)
@set_time_limit(0);
// Создание сокета TCP: resource socket_create(1, 2, 3);
// 1) AF_INET - семейство протокола или домен. Для соединений
// осуществляемых через интернет используется AF_INET,
// для UNIX используется AF_Unix (но об этом позже)
// 2) SOCK_STREAM - обычно используется для TCP (SOCK_DGRAM - UDP)
// 3) Протокол для TCP - SOL_TCP, UDP - SOL_UDP
// возвращает дескриптор сокета
if(($socket = socket_create(AF_INET, SOCK_STREAM, SOL_TCP)) < 0)
{
print("Невозможно создать сокет: " .
socket_strerror(socket_last_error()) . "\n");
}
// Биндим сокет на определённый адрес и порт: boolean socket_bind(1, 2, 3);
// 1) Дескриптор сокета
// 2) IP адрес, или путь до сокета в Unix
// 3) Порт (в нашем случае порт = 666)
if(($error = socket_bind($socket, "127.0.0.1", 666)) < 0)
{
print("Невозможно привязать сокет :" .
socket_strerror(socket_last_error()). "\n");
}
// Прослушиваем сокет: boolean socket_listen(1, 2);
// 1) дескриптор сокета
// backlog размер очереди запрросов ожидающих соединения
if(($error = socket_listen($socket, 5)) < 0)
{
print("Невозможно прослушать сокет: " .
socket_strerror(socket_last_error()) . "\n");
}
// Слушаем вечно ;)
while(TRUE)
{
// ожидаем соединение
// socket_accept(дескрипток сокета) - принимает входящие соединение и делает на скрипт сервером.
if(($accept = socket_accept($socket)) < 0)
{
print("Ошибка при чтении: " .
socket_strerror($message) . "\n");
break;
}
// выводим рандомную строку из файла
socket_write($accept, getRandMessage($FHandle));
print(date("Y-m-d H:i:s", time())." STATUS: client connected.\n");
ob_flush();
while(TRUE)
{
// Считываем заданное количество байт из указанного сокета
if(FALSE === ($line = @socket_read($accept, 2048)))
{
print("Невозможно прослушать сокет: " .
socket_strerror(socket_last_error()) . "\n");
break 2;
}
switch(strtolower(trim($line)))
{
case "bye" :
print(date("Y-m-d H:i:s", time())." STATUS: client close connection.\n");
break 2;
break;
case "more" :
// записываем данные из буфера в сокет
if(!@socket_write($accept, getRandMessage($FHandle)."\r\n"))
{
print(date("Y-m-d H:i:s", time())." STATUS: client close connection.\n");
break 2;
}
break;
default :
// записываем данные из буфера в сокет
if(!@socket_write($accept, "Unknown command, 'bye' to exit.\r\n"))
{
print(date("Y-m-d H:i:s", time())." STATUS: client close connection.\n");
break 2;
}
break;
}
print(date("Y-m-d H:i:s", time()). " READ: ".$line."\n");
ob_flush();
}
// закрываем соединение
socket_close($accept);
}
// Закрываем сокет
socket_close($socket);
function getRandMessage(&$Array)
{
return ($Array[rand(0, count($Array)-1)]);
}
?>
Думаю многое понятно. Назовём его например socket.php. Теперь запускаем наш скрипт-сервер командой: php socket.php в командной строке.
Тестируем приложение
Для начала выведем все активные TCP соединения
C:\Documents and Settings\t3rr4n>netstat -o -a -p TCP
Активные подключения
Имя Локальный адрес Внешний адрес Состояние PID
TCP work-012f823131:http work-012f823131:0 LISTENING 2112
TCP work-012f823131:epmap work-012f823131:0 LISTENING 1188
TCP work-012f823131:microsoft-ds work-012f823131:0 LISTENING 4
TCP work-012f823131:doom work-012f823131:0 LISTENING 1552 <-- это мы висим
TCP work-012f823131:1029 work-012f823131:0 LISTENING 884
TCP work-012f823131:1048 work-012f823131:0 LISTENING 2032
TCP work-012f823131:3306 work-012f823131:0 LISTENING 2444
TCP work-012f823131:1046 205.188.8.253:https ESTABLISHED 2032
TCP work-012f823131:netbios-ssn work-012f823131:0 LISTENING 4
DOOM это ассоциация с портом "666" (в игре "DooM" используется именно этот порт ;) ). Т.е наше приложение ожидает подключение. Проверим что это за приложение запущено по PID 1552:
C:\Documents and Settings\t3rr4n>tasklist | find "1552"
php.exe 1552 Console 0 4а064 КБ
C:\Documents and Settings\t3rr4n>tasklist | find "php.exe"
php.exe 2716 Console 0 812 КБ
php.exe 1552 Console 0 4а064 КБ
Теперь попробуем подключиться и посылать комманды (на рис. всё понятно). Я использовал известную программу NetCat, вы можете Telnet но лучше NC:
C:\Documents and Settings\t3rr4n>nc 127.0.0.1 666
Хай!
http://s59.radikal.ru/i163/0901/7f/d0d0b6dcb872.jpg
Ну на этом всё. Теперь вы можете тоже попробовать написать какой-нибудь демон, может быть бота или ещё что-то более интересное, ведь большинство приложений в сети используют именно сокеты, так что это основа основ. Кстати в большинстве языков программирования поддерживаются сокеты и принцип работы с ними везде одинаковый. Который я описал выше.
Ой, это для меня сложно...(
Pashkela
12.01.2009, 02:21
Что, вот так взял и за минуту всё прочитал?:)
imajo.ati
31.05.2009, 01:14
очень небольшая статья по PHP
некоторое время назад понадобилось из PHP-CLI скрипта
вызвать внешнюю программу, не дожидаясь её выполнения
в операционной системе windows
вопрос возник потому, что стандартные пхп функции system,
exec и т.д. приостанавливают работу скрипта до тех пор, пока
заданный в них параметр не выполнится.
спрашивал на форуме - сказали что винда г, юзать nix и запускать
команду в фоновом режиме амперсандом, но надо было в винде.
и вот сегодня почитав мануал по win оболочке дошел до команды
START, которая как раз делает то, что нужно =)
синтаксис можно посмотреть так: start /?
и, наконец, применение в пэхэпэ скрипте:
system("start php.exe c:\\file.php");
- вызывает на исполнение файл c:/file.php интерпретатором пхп ПАРАЛЛЕЛЬНО с
текущим скриптом (т.е. родительский скрипт продолжает выполняться потому что
команда start после запуска указанной программы завершается и следовательно
функция system завершается )
ну конечно при условии что win знает где лежит php.exe
т.к. я раньше не знал этого и думал что это невозможно
(как впрочем мне и сказали тогда на форуме)
решил выложить в помощь людям, которые ещё не знают этого
и которым это может понадобиться
.:EnoT:.
31.05.2009, 16:03
Парсинг страниц с защитой на JavaScript
[INTRO]
Многие начинающие и не очень начинающие кодеры при написании парсеров/грабберов сталкиваются с проблемой, что вывод
данных на страницу производится яваскриптом, да ещё и с динамическими именами переменных, массивов и т.д.
Собственно решил написать эту статейку.
[Способ решения]
Вот так недавно наткнулся на один код.
На странице выводилась прокся (IP : Port). Но выводилось при помощи JS.
Наша задача - получить адрес и порт прокси при помощи PHP, не прибегая к каким-либо выполнениям на стороне клиента.
Код страницы выглядел примерно вот так:
<HTML><BODY>
<script>
lXaLNu = new Array(742,62,948,760,41,960,48);
auAQmk = parseInt((((500+lXaLNu[0])*lXaLNu[1]+lXaLNu[2]+lXaLNu[3])*lXaLNu[4]-lXaLNu[5]-lXaLNu[6])*10)/10-3226178;
jmJZrOkTxr = new Array(351,30,25,715,874);
JACwFMTS = parseInt((((109+jmJZrOkTxr[0])*jmJZrOkTxr[1])*jmJZrOkTxr[2]+jmJZrOkTxr[3]+jmJZrOkTxr[4])*10)/10-346439;
pYSHW = new Array(425,482,67,716,370,432);
nlM = parseInt(((843+pYSHW[0]+pYSHW[1])*pYSHW[2]+pYSHW[3]-pYSHW[4]+pYSHW[5])*10)/10-105771;
CIjU = new Array(374,514,208);
NCfWOOCO = parseInt((424+CIjU[0]+CIjU[1]-CIjU[2])*10)/10-894;
ZuIGvQrzIMTS = new Array(112,185,735,61,91);
myiDrcfCi = parseInt(((287+ZuIGvQrzIMTS[0]-ZuIGvQrzIMTS[1]-ZuIGvQrzIMTS[2])*ZuIGvQrzIMTS[3]+ZuIGvQrzIMTS[4])*10)/10+31828;
TMUuMPjfRhm = parseInt(NCfWOOCO)+'.'+parseInt(auAQmk)+'.'+parseI nt(myiDrcfCi)+'.'+parseInt(JACwFMTS)+':'+parseInt( nlM);
</script>
Proxy IP:PORT : <script>document.write(TMUuMPjfRhm);</script>
Имена переменных, массивов были динамическими, последовательности и величины математических операций так же были различными при
каждой перезагружке страницы.
Казалось бы сложно, на самом деле нет :)
Рассмотрим код:
Каждая переменная формирует кусок ip прокси, а одна из них содержит порт. Этот алгоритм не меняется.
Далее переменная TMUuMPjfRhm содержит конечный результат (адрес разделённый точками и через двоеточие порт).
Следовательно нам нужно получить результат этой переменной.
В принципе есть множество способов решения данной проблемы, в целом всё зависит от воображения программиста.
Сейчас мы рассмотрим один из способов - преобразование JS кода в PHP и выполнение.
И так пошагово:
Отпарсить кусок нужного JavaScript
Заменить JS переменные и массивы на PHP
Заменить JS функции на эквивалентные PHP
Выполнить полученный код через eval() и создать переменную, содержащую конечный результат
Всё, что для этого нужно это знание регулярных выражений, ну и синтаксиса PHP (как бы банально это не звучало),
иначе eval() код с ошибками кушать не будет :)
[Поехали]
1. Парсим код.
Всё, что нам нужно для счастья это код между <script></script>.
preg_match('#<script>(.+)</script>#Uis', $source, $out);
В $out[1] теперь содержится нужный нам код.
2. Парсим имена массивов и переменных
preg_match_all('#([a-z]+)\s=\snew#i', $out[1], $arrs);
preg_match_all('#([a-z]+)\s=\sparse#i', $out[1], $vars);
Получаем
Переменные
Array
(
[0] => auAQmk
[1] => JACwFMTS
[2] => nlM
[3] => NCfWOOCO
[4] => myiDrcfCi
[5] => TMUuMPjfRhm
)
Массивы
Array
(
[0] => lXaLNu
[1] => jmJZrOkTxr
[2] => pYSHW
[3] => CIjU
[4] => ZuIGvQrzIMTS
)
Теперь преобразуем все переменные в PHP путём добавления знака доллара. Для этого напишем небольшую функцию
обратного вызова, чтобы применить её ко всем элементам массивов $arrs[1] и $vars[1].
function add_dollar($elem) {
return '$' . $elem;
}
Применяем:
$php_arrs = array_map('add_dollar', $arrs[1]);
$php_vars = array_map('add_dollar', $vars[1]);
Далее заменяем преобразованные имена в нашем коде
$out[1] = str_replace($arrs[1], $php_arrs, $out[1]);
$out[1] = str_replace($vars[1], $php_vars, $out[1]);
Заменили, едем дальше.
3. Меняем JS функции на эквивалентные PHP
Здесь используется всего-лишь одна функция parseInt. Эквиватент ей в PHP - intval() или в данном примере
даже подойдёт abs().
Заменим на intval():
$out[1] = str_replace('parseInt', 'intval', $out[1]);
Далее смотрим на массивы, видим new Array(). Но так как в PHP массив не является объектом, а простой функцией array()
заменим это дело, просто убрав new:
$out[1] = str_replace('new ', '', $out[1]);
В последней переменной, которая формирует результат мы видим JS-конкатенацию (знак плюса).
Заменяем ёё на PHP-конкатенацию (точка)
$out[1] = str_replace(
array("'+", "+'"),
array("' . ", " . '"),
$out[1]);
Хитрый финт ушами и у нас уже готовый PHP-код:
$lXaLNu = Array(742,62,948,760,41,960,48);
$auAQmk = intval((((500+$lXaLNu[0])*$lXaLNu[1]+$lXaLNu[2]+$lXaLNu[3])*$lXaLNu[4]-$lXaLNu[5]-$lXaLNu[6])*10)/10-3226178;
$jmJZrOkTxr = Array(351,30,25,715,874);
$JACwFMTS = intval((((109+$jmJZrOkTxr[0])*$jmJZrOkTxr[1])*$jmJZrOkTxr[2]+$jmJZrOkTxr[3]+$jmJZrOkTxr[4])*10)/10-346439;
$pYSHW = Array(425,482,67,716,370,432);
$nlM = intval(((843+$pYSHW[0]+$pYSHW[1])*$pYSHW[2]+$pYSHW[3]-$pYSHW[4]+$pYSHW[5])*10)/10-105771;
$CIjU = Array(374,514,208);
$NCfWOOCO = intval((424+$CIjU[0]+$CIjU[1]-$CIjU[2])*10)/10-894;
$ZuIGvQrzIMTS = Array(112,185,735,61,91);
$myiDrcfCi = intval(((287+$ZuIGvQrzIMTS[0]-$ZuIGvQrzIMTS[1]-$ZuIGvQrzIMTS[2])*$ZuIGvQrzIMTS[3]+$ZuIGvQrzIMTS[4])*10)/10+31828;
$TMUuMPjfRhm = intval($NCfWOOCO) . '.' . intval($auAQmk) . '.' . intval($myiDrcfCi) . '.' . intval($JACwFMTS) . ':' . intval($nlM);
4. Выполняем полученный код
Для начала создадим переменную, которая будет содержать результат. Ведь к переменной $TMUuMPjfRhm мы не можем обращаться постоянно,
так как имя её меняется.
Поэтому, чтоб код был постоянно рабочим при любых изменениях переменных достанем имя последней переменной из массива (того, когда парсили)
имена переменных. И создадим независимую переменную, содержащую результат.
$out[1] .= '$proxy = ' . array_pop($php_vars) . ';';
Осталось лишь выполнить наш PHP-код через eval()
eval($out[1]);
Теперь адрес проксика будет в переменной $proxy
echo $proxy;
[Вывод]
Как все знают, идеальной защиты не существует и JS тому не исключение :)
Был продемонстрирован всего один из тысячи способов получения контента страницы с казалось бы такой крутой защитой.
В общем удачных кодесов :)
В аттаче весь код этой статьи с комментариями
Оч интересно... Спасибо енот..
В карту статей и ниииет)
wildshaman
31.05.2009, 16:29
Это было реально охуенно, в статьи)
mixkorshun
08.06.2009, 05:21
Кэширование Web-страниц
Эта статья ориентирована не на спецов, так что определения некоторых понятий точностью ни изобилуют, главное чтобы было понятно.. Прошу сильно не ругать, так как пишу подобное впервые - за здоровую критику буду благодарен..
Недавно при написании сайта я столкнулся с проблемой кэширования. Долго искал информацию на эту тему, то что нарыл укладывается в один стандартный алгоритм. Примерная его суть:
Получаем URL страницы
Преобразуем в имя файла
Тут варианты: либо все куда то записать(по-типу БД) либо же сохраняем в папку так
Как только обращаются к странице проверяем ее на срок истечения действительности кэша и выводим
Очевидные проблемы:
Скрипт регистрации к примеру выдает специфичные данные для каждого человека(хотя строка может быть и одинаковой), так что кэшировать надо бы выборочно...
Наклевывается вопрос: а если POST или например COOKIE? Тогда URL может быть одинаковым для разных страниц!
Из-за всего этого пришлось изобретать свой велосипед(хотя на новаторство идеи не претендую, вряд-ли кто-то до этого не догадывался):
Используем Базу Данных
Будем хранить к примеру такую таблицу(для простого случая подходит):
---------------------------
page | cache_time
---------------------------
По сути кажется что таблица будет весить неимоверно много, но вот тут-то и надо встряхнуть тем серым веществом, которое мы по наивности называем мозгом. :D Для большинства страниц в базе данных cache_time окажется одинаковым, исключениями будут страницы регистрации, новостные ленты(и то не факт) и.т.п... Зачем хранить там все страницы? В самом скрипте заведем константу, и будем всегда пользоваться ее значением, но перед этим желательно проверять, а нету ли чего-нибудь особенного для этой страницы в базе данных. В итоге 90% страниц будут использовать значение константы, а для 10% можно и пожертвовать драгоценным местом в БД.
Выборочное кэширование
Первый вопрос: у вас на сайте есть что-то наподобие этого? Если нет - кэшируйте все на здоровье, а если да, то что?
http://img266.imageshack.us/img266/364/screeng.jpg
А ответ прост, нужно всего лишь не кэшировать ту информацию, которая изменятся от пользователя к пользователю. Т.е. вместо всей страницы, мы сохраним в кэш только контент, а генерация остального, очень часто, не столь долгое дело, и заморачиваться со вставкой данных в кэш будет накладней, чем просто генерировать эти элементы страницы каждый раз. Вывод: Иногда удобней кэшировать только часть страницы.
POST и COOKIE
По сути бесполезность той схемы которую я описал вначале я впервые ощутил столкнувшись с HTTP POST, мое решение не будет изобиловать оригинальностью, но.. По-моему проще всего завести функцию для генерации имени файла в зависимости от уникальных параметров переданных этой функции. Т.е. не будем опираться только на URL, лучше возьмем за основу путь к скрипту и его уникальные параметры.
Вот наверно и все что я хотел написать..
Успехов в ваших разработках! mixk0rshun
P.S.:
Кэширование вряд ли будет иметь много смысла для мелкого сайта, но для крупных разработок оно сильно экономит процессорное время, для маленьких проектов - скорее только затормозит...
И напоследок некоторый совет: проще всего использовать в папке кэша каталоги, т.е:
Страница: http://example.com/forum/index.php?id=3
Кэш: cache/forum/index.php/id=3
mixkorshun
09.06.2009, 00:56
хотелось бы услышать коментарии...
FireFenix
09.06.2009, 01:14
хотелось бы услышать коментарии...
Закешированные страницы в БД, это тоже самое, что юзать железные шаблона html :) Да и занимать будет целую торбу места. Так что это не оптимально.
Если контент тяжёлый (флешка, видос), то используются предзагрузка.
В общем я не видел ниодного обычного сайта с кешированием. Если где-то используется - приведи сайт (кроме гугла, ну и темболее он кешурет не для отображения своих страниц :) ).
astrologer
09.06.2009, 04:40
а если POST или например COOKIE?А при чём тут cookie?По сути бесполезность той схемы которую я описал вначале я впервые ощутил столкнувшись с HTTP POST, мое решение не будет изобиловать оригинальностью, но.. По-моему проще всего завести функцию для генерации имени файла в зависимости от уникальных параметров переданных этой функции. Т.е. не будем опираться только на URL, лучше возьмем за основу путь к скрипту и его уникальные параметры. Проблемы возникают из-за того, что это "клиентский" подход к кешированию. Примерно такое уже реализовано в браузере, остается лишь посылать правильные заголовки.
Метод post же не является ни безопасным, ни идемпотентным.
Кеширование на сервере должно происходить на другом уровне, чтобы сохранять результаты работы шаблонизатора, статистику, частые выборки из бд, и т.д.
В общем я не видел ниодного обычного сайта с кешированием. Если где-то используется - приведи сайт (кроме гугла, ну и темболее он кешурет не для отображения своих страниц ). Напротив, кеширование используется почти везде, поскольку это простой и удобный способ повысить производительность.
FireFenix
09.06.2009, 08:04
Напротив, кеширование используется почти везде, поскольку это простой и удобный способ повысить производительность.Произв дительность в основном страдает у динамических данных, а не у статических, поэтому кеширование тут не сильо помогает
astrologer
09.06.2009, 08:51
Производительность в основном страдает у динамических данных, а не у статических, поэтому кеширование тут не сильо помогает Так речь и шла о динамических - mixkorshun приводит в пример форум и почту.
FireFenix
09.06.2009, 10:24
Так речь и шла о динамических - mixkorshun приводит в пример форум и почту.
Он кеширует статические данные, которые одинаковые для одного пользователя.
Если кешировать все динамические данные, скажем для почты - количество писем в папках, сами письма, темы писем. То на одного пользователя необходимо будет очень много местаи сама система станет не эффективной.
Ресурсы для ввода/вывода шаблонов и их обработки не велики. В основном производительность падает на запросах MySQL и сложных алгоритмов обработки данных на сервере.
смотрите у меня есть скрипт какой достает с базы данные и их выводит в блоке (типо топ) и мне надо сделать так чтобы при нажатии на кнопку Обновить он с помощью JQUERY запроса обновлял данные... как это сделать?
FireFenix
09.06.2009, 17:39
смотрите у меня есть скрипт какой достает с базы данные и их выводит в блоке (типо топ) и мне надо сделать так чтобы при нажатии на кнопку Обновить он с помощью JQUERY запроса обновлял данные... как это сделать?
Для этих целей есть раздел http://forum.antichat.ru/thread41870.html
А по вопросу читай про AJAX в JQUERY -> http://habrahabr.ru/blogs/jquery/42426/
сорри, просто я видел что тут тоже по JQUERY...
mixkorshun
10.06.2009, 02:32
FireFenix astrologer
я предлагаю кэш не только статических данных... пример - есть новостная лента на сайте - она для всех одинакова - значит её мы кэшируем, а есть header сайта с именем пользователя: он для каждого разный - кэширование не выгодно..(эт так - на вскидку)
в целом хоть как? сильн плохо?
mixkorshun
10.06.2009, 02:39
Закешированные страницы в БД, это тоже самое, что юзать железные шаблона html
кэш в файлах, в БД хранится записи об исключительных страницах... Т.е. для всего сайта кэш обнавляется раз в 12 часов, а для /forum.php раз в 10 минут, к примеру...
mixkorshun
10.06.2009, 02:44
А при чём тут cookie?
куки и POST не меняют URL страницы, а все алгоритмы которыя я вычитал опираются на него.
Примерно такое уже реализовано в браузере, остается лишь посылать правильные заголовки.
браузеры бывают разные, а сейчас сайтам не прилично писать внизу: Наилучший вид в IE
FireFenix
10.06.2009, 02:48
FireFenix astrologer
я предлагаю кэш не только статических данных... пример - есть новостная лента на сайте - она для всех одинакова - значит её мы кэшируем, а есть header сайта с именем пользователя: он для каждого разный - кэширование не выгодно..(эт так - на вскидку)
в целом хоть как? сильн плохо?
Ну кеширование не слижком расширенно и имеет чисто спецефическое применение.
В RSS скрипт генерирует новость определённой длинны, а то новости на некоторых сайтах достигали бы гигабайты.
Кеширование в основном применяется в поисковых системах для создания копии информации сайта и дальнейшего её анализа.
mixkorshun
10.06.2009, 04:04
RSS в виду не имел, имелл ввиду просто страницу с новостями к примеру..
astrologer
10.06.2009, 11:35
куки и POST не меняют URL страницы, а все алгоритмы которыя я вычитал опираются на него.cookie не является методом http, в отличие от post, get, head, и т.д. Как можно ставить их в один ряд?браузеры бывают разные В поддержке http у них не всё так плохо, не стоит этим пренебрегать.
в целом хоть как? сильн плохо?Нет, не сильно, а следующая статья будет про reverse-proxy? :)
FireFenix
10.06.2009, 15:01
cookie не является методом http, в отличие от post, get, head, и т.д. Как можно ставить их в один ряд?
Нука просвети, как же куки передаются? разве не в заголовке html?
RSS в виду не имел, имелл ввиду просто страницу с новостями к примеру..
Темболее в новостях. Там каждые 30 минут новые новости :)
mailbrush
10.06.2009, 15:03
Куки передаются в ЗАГОЛОВКЕ. Это НЕ ЕСТЬ метод передачи даных.
Автор: Цыгырлаш Игорь (05.04.2006)
В некоторых случаях можно пожертвовать привычным видом элементов управления и немного оживить интерфейс своими собственными стилями. Сегодня мы поговорим о полосах прокрутки (scrollbar), а точнее о том, как изменить их вид с помощью CS
CSS свойства scrollbar
С самого начала хочу отметить, что описываемые ниже CSS свойства являются расширением спецификации CSS2, введенным компаний Microsoft, реализованным начиная с IE 5.5
Полоса прокрутки состоит из фона, ползунока и концевых кнопок со стрелками.
http://i007.radikal.ru/0806/90/ac02285a8c6f.gif
Кнопки могут быть как активными так и нет. Если скроллбар неактивен, то ползунок отсутсвует.
http://i052.radikal.ru/0806/dc/f84724768fcf.gif
Самый простой способ изменить полосу прокрутки это задать свойство scrollbar-base-color. Это свойство задает основной цвет полосы прокрутки. Если не определены другие свойства полосы прокрутки, то бегунок и кнопки прокрутки будут отображаться определенным вами цветом с применением трехмерных эффектов. Фон полосы прокрутки будет отображаться тоже этим цветом, но только осветленным.
Например, scrollbar-base-color:lime приведет к результат представленому на рисунке ниже.
http://i028.radikal.ru/0806/20/1f142c588f7e.gif
Конечно можно делать более тонкие настройки полосы прокрутки при помощи других CSS свойств.
scrollbar-3dlight-color
- задает цвет верхней и левой границ полосы прокрутки, ее бегунка и стрелок.
scrollbar-arrow-color
- задает цвет стрелок на кнопках полосы прокрутки.
scrollbar-darkshadow-color
- задает цвет "тени", отбрасываемой бегунком и кнопками полосы прокрутки (цвет правых и нижних гранией).
scrollbar-face-color
- задает основной цвет бегунка и кнопок прокрутки полосы прокрутки.
scrollbar-highlight-color
- задает цвет "освещенной" части бегунка и кнопок прокрутки полосы прокрутки (цвет левых и верхних их граней).
scrollbar-shadow-color
- задает цвет "неосвещенной" части бегунка и кнопок прокрутки полосы прокрутки (цвет правых и нижних их граней). Не путать с цветом "тени", задаваемым атрибутом scroll-darkshadow-color.
scrollbar-track-color
- задает цвет фона полосы прокрутки, той ее части, по которой перемещается бегунок.
http://i014.radikal.ru/0806/55/00ca8f703219.gif
Как говорилось выше, концевые кнопки могут быть либо активными, либо не активными. Различие между активными и не активными кнопками заключается только в цветах, используемых при отображении кнопок. На активной кнопке стрелка изображается при помощи цветов scrollbar-arrow-color (рисунок выше). На неактивной кнопке стрелка отображается при помощи цветов scrollbar-shadow-color и scrollbar-highlight-color. Остальные элементы активной и неактивной кнопки полностью совпадают.
http://i036.radikal.ru/0806/eb/55d55e4b0e95.gif
Отдельно о фоне
Фон полосы прокрутки задается посредством свойства scrollbar-track-color (смотри рисунок выше). Если это свойство не задано, то фон формируется из двух цветов (scrollbar-highlight-color и scrollbar-face-color), расположенных в шахматном порядке (смотри рисунок ниже).
http://i006.radikal.ru/0806/11/aaa32315e06b.gif
Это поведение связано с директивой DOCTYPE и её влиянием на боксовую модель браузера. В общем, если браузер находится в режиме совместимости (Quirks mode), то все OK, но если браузер следует стандартам (Standards mode), то стили для скроллбаров, применяемые к BODY не работают. Не вдаваясь в подробности скажу, что это легко исправить, применяя стили также и к элементу HTML (смотрите пример ниже) .
Примеры
/* CSS правила для полос прокрутки окна браузера */
html, body {
scrollbar-3dlight-color:red;
scrollbar-arrow-color:yellow;
scrollbar-highlight-color: aqua;
scrollbar-face-color:green;
scrollbar-shadow-color:fuchsia;
scrollbar-darkshadow-color:blue;
scrollbar-track-color: maroon;
}
/* CSS правила для полос прокрутки элементов TEXTAREA */
textarea {
scrollbar-base-color:lime;
}
ПС запостил потому как сам столкнулся с проблемой несоответствия стиля сайта с скролбаром,вот и решил что мб кому-то пригодится
Расскажу как сделать так, чтобы под изображением находился необходимый текст, и при наведении мышкой на изображений, этот текст красиво занимал место изображения.
Все будет проделано благодаря замечательному фреймворку jQuery.
Как всегда, в самом верху документа подключаем фреймворк, стили, другие скрипты. Не забываем про относительные пути к этим файлам.
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="jquery.min.js"></script>
<title>Untitled Document</title>
<script type="text/javascript">
$(function() {
$(".slideBox").hover(function(){
$(this).find("img").stop().animate({
top:-325
}, 500);
}, function(){
$(this).find("img").stop().animate({
top:0
}, 500);
});
});
</script>
Теперь в теле документа нам необходимо в слой с классом "slideBox" поместить изображение и текст под ним. Текст в свою очередь должен находится внутри <div> с классом "content":
<div id="container">
<div class="slideBox">
<img src="images/picture1.jpg" alt="testing" />
<div class="content">
<h1>HTML Ipsum Presents</h1>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
</div>
</div>
</div><!--end slideBox-->
<div class="slideBox">
<img src="images/picture2.jpg" alt="testing" />
<div class="content">
<h1>HTML Ipsum Presents</h1>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
</div>
</div>
</div><!--end slideBox-->
</div><!--end container-->
Как Вы видите под картинкой может быть не просто текст, а полноценный HTML код.
Источник урока: www.suciuvlad.com
Надеюсь, кому-то понадобилось.
Расскажу как сделать очень простую модификацию, которая поможет Вашим посетителям создавать более безопасные пароли при заполнении форм.
После того, как пользователь вводит желаемый пароль, скрипт делает запрос к другому PHP файлу, который проверяет пароль на маленькие и большие буквы, символы и числа. Индикатор, который будет показывать сложность пароля, отобразится на странице без перезагрузки.
Для начала нам необходимо создать файл form.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function toggle_pass(passid) {
if (window.XMLHttpRequest) {
http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
http = new ActiveXObject("Microsoft.XMLHTTP");
}
handle = document.getElementById(passid);
var url = 'ajax.php?';
if(handle.value.length > 0) {
var fullurl = url + 'do=check_password_strength&pass=' + encodeURIComponent(handle.value);
http.open("GET", fullurl, true);
http.send(null);
http.onreadystatechange = statechange_password;
}else{
document.getElementById('password_strength').inner HTML = '';
}
}
function statechange_password() {
if (http.readyState == 4) {
var xmlObj = http.responseXML;
var html = xmlObj.getElementsByTagName('result').item(0).firs tChild.data;
document.getElementById('password_strength').inner HTML = html;
}
}
</script>
<style type="text/css">
input {
border: 1px solid #000000;
padding: 5px;
}
#password_strength {
width: 250px;
background: #cccccc;
}
#password_bar {
font-size: 11px;
background: #7FFF00;
border: 1px solid #cccccc;
padding: 5px;
}
</style>
</head>
<body>
<input id="pass" type="password" name="password" onchange="toggle_pass('pass')" /><br /><br />
<strong>Сложность пароля</strong>:<br />
<div id="password_strength"> </div>
</body>
</html>
Теперь нам необходимо создать файл ajax.php, который будет проверять пароль на сложность и выдавать вердикт.
<?php
$do = $_GET['do'];
switch($do) {
case 'check_password_strength':
$password = $_GET['pass'];
$strength = 0;
// буквы (маленькие)
if(preg_match("/([a-z]+)/", $password)) {
$strength++;
}
// буквы (большие)
if(preg_match("/([A-Z]+)/", $password)) {
$strength++;
}
// числа
if(preg_match("/([0-9]+)/", $password)) {
$strength++;
}
// символы
if(preg_match("/(W+)/", $password)) {
$strength++;
}
header('Content-Type: text/xml');
header('Pragma: no-cache');
echo '<?xml version="1.0" encoding="UTF-8"?>';
echo '<result><![CDATA[';
switch($strength) {
case 1:
echo '<div style="width: 25%" id="password_bar">Очень легкий</div>';
break;
case 2:
echo '<div style="width: 50%" id="password_bar">Легкий</div>';
break;
case 3:
echo '<div style="width: 75%" id="password_bar">Сложный</div>';
break;
case 4:
echo '<div style="width: 100%" id="password_bar">Очень сложный</div>';
break;
}
echo ']]></result>';
break;
default:
echo 'Error, invalid action';
break;
}
?>
После того как оба файла будут созданы и загружены на сервер с поддержкой PHP, у Вас должно получиться что-то наподобии этого:
http://ruseller.com/lessons/les170/result.jpg
Поэкспериментировав с CSS и HTML, можно добиться более красивого результата, но для общего развития и этого примера будет достаточно.
Спасибо за Ваше внимание!
Источник урока: www.tutorialtoday.com
Трюк, который поможет вам возпроизводить GIF изображения при наведении на них курсором.
Что нам нужно:
Первая картинка — статическая (первый кадр анимированного изображения);
Вторая картинка сама анимация.
Берем анимационную картинку и помещаем ее внутрь тега <a>, то есть делаем ее ссылкой. Задаем определенный класс:
<a class="animgif" href="#"><img src="animation.gif" /></a>
Далее приступим к стилям:
.animgif {
display: block;
width: 150px; /* Ширина и */
height: 150px; /* высота картинки */
background: url("stat.gif") no-repeat; /* Заливаем блок статичной картинкой */
}
a.animgif img {
visibility: hidden; /* Aнимация не будет видна в ситуации, когда мышь не наведена */
}
a.animgif:hover {
background: none; /* Фон (статичное изображение) не должно быть видно при наведении мыши */
}
a.animgif:hover img {
visibility:visible; /* При наведении анимация показывается */
border: 0; /* без рамки */
}
Вот и все.
Давно еще заметил не большую, но приятную мелочь в html :)
Тег <a> параметр title=""
В браузерах Internet Explorer, Apple Safari, Google Chrome будет работать вертикальная табуляция:
<a href="http://forum.antichat.ru" title="Форум АНТИЧАТ
Forum ANTICHAT">ссылка</a>
Opera и Mazilla Firefox не хавает вертикальную табуляцию :mad:
Может ктот знает способ, пишите в ПМ :)
life_is_shit
14.10.2009, 16:18
допустим есть код, именно в таком виде в котором привожу (со всеми отступами и прочим)
<table border='0' cellpadding='0' cellspacing='0'>
<tr>
<td>
<img src='image.jpg' border='0' vspace='0' hspace='0' />
</td>
</tr>
</table>
по логике должна просто отобразиться картинка,
на практике под картинкой появляется строка в 1px.
долго ломал башку как исправить, ибо дизайн разъезжался.
выход оказался непредсказуем, удивительно, но вот так все рвботает
<table border='0' cellpadding='0' cellspacing='0'>
<tr>
<td><img src='image.jpg' border='0' vspace='0' hspace='0' /></td>
</tr>
</table>
после этого к IE6 отношусь с благоговейным трепетом :)
Давно еще заметил не большую, но приятную мелочь в html :)
Тег <a> параметр title=""
В браузерах Internet Explorer, Mazilla Firefox, Apple Safari, Google Chrome будет работать горизонтальная табуляция:
<a href="http://forum.antichat.ru" title="Форум АНТИЧАТ
Forum ANTICHAT">ссылка</a>
Opera не хавает горизонтальную табуляцию :mad:
Может ктот знает способ, пишите в ПМ :)
Если я правильно понял, то тогда так и Опера хавает)
<a href="http://forum.antichat.ru" title="Форум " "; (без кавычек) АНТИЧАТ
Forum ANTICHAT">ссылка</a>
" "; - код гориз. табуляции соот-но. (без кавычек)
']Если я правильно понял, то тогда так и Опера хавает)
<a href="http://forum.antichat.ru" title="Форум " "; (без кавычек) АНТИЧАТ
Forum ANTICHAT">ссылка</a>
" "; - код гориз. табуляции соот-но. (без кавычек)А вы пробывали этот код? В Opera 10 проверил, не работает:
<a href="http://forum.antichat.ru" title="Форум АНТИЧАТ Forum ANTICHAT">ссылка</a>
:)
А вы пробывали этот код? В Opera 10 проверил, не работает:
<a href="http://forum.antichat.ru" title="Форум АНТИЧАТ Forum ANTICHAT">ссылка</a>
:)
; - забыли в Вашем примере :)
В 9.64 работает ;)
Пример:
<a href="http://forum.antichat.ru" title="Форум АНТИЧАТ Forum ANTICHAT">ссылка</a>
[dword], поправил первый пост, я имел в виду вертикальную табуляцию
; забыл, ага. Еще заметил что в FF тоже не работает.
Тень для текста с помощью CSS
Может кто-то и не знает, но красиво оформить текст с помощью добавления к нему тени можно и без использования всяких JS-скриптов.
Для этого существует свойство text-shadow.
Пример использования:
h2 {
color: #FF0000;
text-shadow: 2px 2px 4px #0000FF;
}
<h2>Текст с тенью</h2>
Теперь наш заголовок второго уровня будет красный с синей тенью.
Циферки в свойстве означают:
Первые две цифры (2px 2px) — смещение тени на n пикселей по горизонтали и вертикали соответственно. Т.е. в нашем примере тень будет смещена на 2 пикселя вправо и вниз.
Можно указывать и отрицательные значения, тогда тень будет смещаться влево вверх.
Третья цифра (4px) — ширина тени.
Ну и последним в свойстве указывается цвет тени, в нашем случае это синий.
Вот, впринципе и все. Единственная проблема — совместимость с браузерами.
В Opera 10, Firefox 3.5.3, Chrome 3.0.195 — все ок работает;
в InternetExplorer 8 — не работает.
JSfunction add_favorite(a) {
title=document.title;
url=document.location;
try {
// Internet Explorer
window.external.AddFavorite(url, title);
}
catch (e) {
try {
// Mozilla
window.sidebar.addPanel(title, url, "");
}
catch (e) {
// Opera
if (typeof(opera)=="object") {
a.rel="sidebar";
a.title=title;
a.url=url;
return true;
}
else {
// Unknown
alert('Нажмите Ctrl+D чтобы добавить страницу в закладки.');
}
}
}
return false;
}HTML<a href="#" onclick="javascript: return add_favorite(this);">Добавить в Избранное</a>
Результаты проверки:
Opera 10.00 - работает
Internet Explorer 7 - работает
Mozilla Firefox 3.0.14 - работает
Google Chrome 3.0.195.27 - alert (Ctrl+D работает)
Apple Safari 4.0 (530.17) - alert (Ctrl+D работает)
:cool:
DonkeyDick
В теле страницы все равно остается куча не нужного кода. А за <xml и <noscript> ждите бан. вашему сайту..
Известно, хостерщики любят навешивать баннеры.
Это партнерство. Ты бесплатно используешь их хостинг, они привлекают потенциальных клиентов...
Единственное верное решение - потратить 50 рублей себе на хостинг =\
А за <xml и <noscript> ждите бан. вашему сайту..
Вообще бред, можно подумать, что каждый сайт, использующий эти теги, неизбежно отправляется в баню! Сколько раз юзал <noscript> и всё было в порядке, никакого бана не последовало.
DonkeyDick,
LStr1ke,
Статические баннеры можно скрывать параметром opacity:
img {
opacity: 1.0;
filter:progid:DXImageTransform.Microsoft.Alpha (opacity=100);
}
Статья: Мини-комментатор на Php в одном файле,использующий в качестве бд файлы.
Я недавно начал изучать PHP и сразу захотелось создать что-нибудь,да не просто 1+1=2 ,а довольно полезное...
Итак:
Всё в трёх файлах,ниже --- и форма и вывод:
<html><?php
include('config.php');
#вывели данные
$fh = file("mess.txt");
for ($i = count($fh); $i>0; $i--) echo ($fh[$i-1]."<br>"); ?>
<form name="form1" method="post" action="vid.php">
<INPUT TYPE="text" NAME="mess"><BR>
<INPUT TYPE="submit" value="Отправить"><BR>
<b>Текст</b>-Текст<BR>
<i>ТЕКСТ</i>-Текст<BR>
</form>
<?php $today = date("H:i:s"); echo ("Щас :<b> $today</b>") ?>
</html>
<?php
#теперь запись
if(isset($_POST['mess'])) {
$mess = $_POST['mess'];
} else {
echo ("Сообщение пусто");
}
if ($mess == '') {
echo (",или заданы неверные символы!");
} else {
$m = $_POST['mess'];
$fh = fopen("mess.txt","a");
$today = date("H:i:s");
$mess = trim($mess);
fwrite($fh,"<BR><FONT COLOR='#0000CC'>$today </FONT><FONT COLOR='#FF0000'>$ip</FONT>$m<BR>");
fclose($fh);
}
?>
Добавочный файл : config.php
<?php
$m = str_replace("","<b>",$m);
$m = str_replace("","</b>",$m);
$m = str_replace("[/i]","</i>",$m);
$m = str_replace("[i]","<i>",$m);
?>
В примере я использовал форму для отправки кс серваков,поскольку все их не запомнить,а в избранном и так их море,тут можно написать ип,хар-ку...
Ник отправителя = Ip через прокси его(как уж знаю так и сделал :) )
Текст : через trim($text) очищаем от вредных знаков...
Респект АНТИЧАТу за обильный материал,на основе которого это было сделано...
Следующий скрипт захэширует пароль так, что его будет очень сложно расшифровать (пробрутить), причём без соли...
<?php
$pass = '123456';
$md5 = md5($_GET['p']);
$md5 = base_convert($md5, 16, 10);
$md5 = strrev($md5);
$md5 = base_convert($md5, 10, 16);
$md5 = md5($md5);
echo "Password's hash: ".$md5;
?>
Стандартный md5 пароля 123456 вернёт e10adc3949ba59abbe56e057f20f883e
после всех операций в скрипте, хэш получится совсем другой (d23f62509ec1c377a9744174e325ee63).
Для усиления ещё можно использовать арифметические операции.
Это не статья, напиши ещё: как разшифровать и сделай полу ввода =)
Постраничная навигация на PHP
Что это и зачем?
Это моя первая маленькая статья на тему PHP,ибо в последнее время занялся php. В этой мини статье я расскажу вам друзья как сделать постраничную навигацию на сайте. Допустим из базы у нас на сайте выводятся новости которые через цикл выкладываются на странице, но если этих новостей в базе много то надо выводить по 4-5 на страницу чтоб страница не растягивалась вниз, и соответственно внизу страницы надо делать ссылку на следующую страницу с 4-5 новостями. Я пытался найти готовый код, но всё что нашёл оказалось каким-то сложным ибо я тока начинаю учить php и в итоге я решил написать всё сам. Да и кстати эта статья наверно больше подойдёт начинающим в php. Вобщем код:
Код
[PHP] <div id="content"> <?php include("parts/menu.html");?> <div class="content_main"> <h3><span class="bright">Галерея</span></h3> <?php #Проверка есть ли переменная check_id от ссылки "вправо" внизу div='content' #если её нет, то она приравнивается нулю if(!isset($_GET["check_id"])){ $check_id=0; } #вытаскивается из массива $_GET if(isset($_GET["check_id"])){ $check_id=$_GET["check_id"]; }else{ #ЕСЛИ чёто не так то она приравнивается нулю $check_id=0; } #соединяемся первый раз $db = mysql_connect("*****","****","****"); $db_connect = mysql_select_db("me",$db); # #Ищем максимальное значение id в БД gallery # $maxim_res=mysql_query("SELECT MAX(id) FROM gallery"); #заносим запрос к БД в $maxim $maxim=mysql_fetch_array($maxim_res); #вытаскиваем из array $maxim первое значение, оно же и есть последнее #в таблице gallery #echo $maxim['0']; #если значение для вывода из таблицы больше чем реальное значение #последнего поля id в таблице, то оно приравнивается нулю #и таким образом загружается первая страница if($check_id>=$maxim['0']){ $check_id=0; } #соединяемся второй раз для вывода данных на страницу # $db = mysql_connect("*******","****","*****"); $db_connect = mysql_select_db("me",$db); $result = mysql_query("SELECT * FROM gallery WHERE id>$check_id LIMIT 2",$db); #вывод данных while($gallery = mysql_fetch_array($result)){ #приравнивается первая ячейка из array $gallery т.е. id из БД gallery #чтоб потом подставить в ссылку "вправо" внизу div='content' $gallery_0 = $gallery["0"]; printf(" <div class='gallery_item'> <a href='%s' target='blank'><img src='%s' class='gallery_img'></a> <a href='%s' target='blank'><img src='%s' class='gallery_img'></a> <p class='p_content_gallery'>%s</p> <br clear='all'> <a href='%s' class='date' target='blank'>%s</a> </div>",$gallery["img_big1"],$gallery["img_small"],$gallery["img_big2"],$gallery["img_small2"],$gallery["text"],$gallery["link_http"],$gallery["link"]); }
Что за файлики инклудятся? Потерял пока писал? Или как :D
Да, как раз для кс я переделал распростанённый код таблицы на HTML под CSS+PHP...
К сожалению я жадный ии админку не вылажу,так как тогда следующие мои статьи можно будет легко взломать --- админка предусмотрена под 3-10 юзеров разных прав,но незащищена от простого <script> и прочего...
Залил картинки тут: Images.rar (http://slil.ru/28441593)
В общем вот мои коды:
CSS стили
body {
margin: 11px 0 0 0;
padding: 0;
background: #000000 url(images/img1.gif) repeat-x;
font: normal small Arial, Helvetica, sans-serif;
color: #999999;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
text-transform: uppercase;
letter-spacing: .2em;
color: #000000;
}
p, ul, ol, blockquote {
margin-top: 0;
line-height: 160%;
}
a {
text-decoration: none;
color: #9ED738;
}
a:hover {
text-decoration: underline;
}
/* Header */
#header {
width: 720px;
height: 161px;
margin: 0 auto;
background: url(images/img2.jpg) no-repeat;
}
#header * {
text-decoration: none;
text-align: center;
color: #000000;
}
#header h1 {
padding-top: 55px;
font-size: 3em;
}
#header h2 {
font-size: 1.2em;
}
/* Menu */
#menu {
width: 720px;
height: 55px;
margin: 0 auto;
}
#menu ul {
margin: 0;
padding: 0;
list-style: none;
line-height: normal;
}
#menu li {
display: inline;
}
#menu a {
display: block;
float: left;
width: 142px;
height: 21px;
padding: 7px 1px 0 1px;
background: url(images/img3.gif) no-repeat center center;
text-align: center;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .2em;
font-size: x-small;
font-weight: bold;
color: #CCCCCC;
}
#menu a:hover, #menu .active a {
background-image: url(images/img4.gif);
color: #FFFFFF;
}
/* Content */
#content {
width: 720px;
margin: 0 auto;
}
#colOne {
float: left;
width: 160px;
}
#colTwo {
float: left;
width: 360px;
padding: 0 20px;
}
#colThree {
float: left;
width: 160px;
}
/* Content Elements */
#content h2 {
height: 21px;
margin-bottom: 20px;
padding: 9px 0 0 10px;
background: url(images/img6.gif);
letter-spacing: normal;
font-size: .9em;
}
#content h3 {
text-transform: uppercase;
letter-spacing: normal;
font-size: x-small;
color: #FFFFFF;
}
#content ul {
margin-left: 0;
padding-left: 0;
list-style: square inside;
}
/* Footer */
#footer {
height: 70px;
padding: 7px 0 0 0;
background: url(images/img5.gif) repeat-x;
}
#footer * {
color: #000000;
}
#footer p {
text-align: center;
font-size: smaller;
rega.php
// если вы пользуетесь чем-либо..// (админка\регистрация, то оставьте Else)
else{
If ($gm =="3") { echo("><BR><BR><BR><BR><BR><BR><BR><BR><BR><div id=content><div id=colOne><h2>Блок админа</h2><h3>Cw</h3><p><br>Вскоре сделаю удаление только отдельных рядов таблиц... <a href=rega.php?del=dule>Удалить все ряды...</a></p>"); if($gm==proverenniy and $del=='dule')
// Если вы без админки,то удалите If и его {}
{unlink("data/wcavto.txt"); unlink("data/wcavtoid.txt");}
$fh = @file("/data/wcavtoid.txt");
echo("<div id=content><div id=coTwo><p><form name=form1 method=post action=rega.php><br><br><br><br><br><p>Здравствуйте,система разработана Shmel<br>
Впишите данные, не обязательно брать подсказочные<BR>
скрипт можно будет скачать для своих нужд,после окончания тестирования<BR></p>
Команда и соперник:<INPUT TYPE=text NAME=team Value='CT vs T' size=35><BR>
Карта:<INPUT TYPE=text NAME=map Value='de_' size=35><BR>
Сколько на сколько?:<INPUT TYPE=text NAME=skoko Value='3 vs 3' size=35><BR>
Победитель:<INPUT TYPE=text NAME=winner Value='Команда?-победитель!' size=35><BR>
Побед(В раундах):<INPUT TYPE=text NAME=countW Value='' size=35><BR>
Проигрышей(В раундах):<INPUT TYPE=text NAME=countD Value='' size=35><BR>
<INPUT TYPE=submit value='Обновить'><BR>
</form></p>");
$arr2 = file("data/wcavtoid.txt"); $i=0; foreach($arr2 as $line2){
$i++; list($avtor,$id)=explode("::",$line2);
$bd['avtor'][]=$avtor;
$bd['id'][]=$id; }
$newid=$id+1;
echo("$newid");
if ($team == '' or $map == '' or $skoko =='' or $winner =='' or $countW =='' or $countD =='') {
echo ("Ахтунг Не введены главные данные");
} else {
$avtor = $c_name; //если нету админки,замените на
// ип человека.
$team = $_POST['team'];
$map = $_POST['map'];
$skoko = $_POST['skoko'];
$winner = $_POST['winner'];
$countW = $_POST['countW'];
$countD = $_POST['countD'];
$fh = fopen("data/wcavto.txt","a+");
$team="<TD class=gTableBody1 noWrap>$team</TD>";
$map="<TD class=gTableBody1 noWrap>$map</TD>";
$skoko="<TD class=gTableBody1 noWrap>$skoko</TD>";
$winner="<TD class=gTableBody1 noWrap>$winner</TD>";
$countWD="<TD class=gTableBody1 noWrap><B>$countW</B>-$countD</TD></TR>\r\n";
$fh = fopen("data/wcavtoid.txt","a+");
fwrite($fh,"$avtor::$newid\r\n");
fclose($fh);
$fh2 = fopen("data/wcavto.txt","a+");
fwrite($fh2,"$team::$map::$skoko::$winner::$countWD::\r\n<TR align=middle>\r\n");
fclose($fh2);
} }
echo ("<TABLE style=BORDER-RIGHT: #494949 0px solid; BORDER-TOP: #494949 0px solid; BORDER-LEFT: #494949 0px solid; BORDER-BOTTOM: #494949 0px solid cellSpacing=0 cellPadding=0 width=100% border=0><TBODY><TR><TD style=BORDER-RIGHT: #262626 0px solid; PADDING-RIGHT: 10px; BORDER-TOP: #262626 0px solid; PADDING-LEFT: 10px; BACKGROUND: #2c2c2c; PADDING-BOTTOM: 10px; BORDER-LEFT: #262626 0px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #262626 0px solid>
<TABLE class=gTable cellSpacing=0 cellPadding=0 width=100% border=1><TBODY>
<TR align=middle>
<TD class=gTableSubTop>Команда - противник</TD>
<TD class=gTableSubTop>Карта</TD>
<TD class=gTableSubTop>Количество</TD>
<TD class=gTableSubTop>Победитель</TD>
<TD class=gTableSubTop>Счёт</TD></TR>
<TR align=middle>");
$arr = file("data/wcavto.txt"); $i=0; foreach($arr as $line){
$i++; list($team,$map,$skoko,$winner,$countWD,$tableend) =explode("::",$line);
$bd['team'][]=$team;
$bd['map'][]=$map;
$bd['skoko'][]=$skoko;
$bd['winner'][]=$winner;
$bd['countWD'][]=$countWD;
$bd['tableend'][]=$tableend; }
for($i=count($arr)-1; $i>=0; $i--) { $see=$bd['team'][$i];
$see.=$bd['map'][$i];
$see.=$bd['skoko'][$i];
$see.=$bd['winner'][$i];
$see.=$bd['countWD'][$i];
$see.=$bd['tableend'][$i];
echo($see); }
// просто ссылки
include("templates/index_end.htm");
}
?>
файлы wcavto.txt и wcavtoid.txt:
wcavto.txt :
<TD class=gTableBody1 noWrap>CT vs T</TD>::<TD class=gTableBody1 noWrap>de_VooDoo</TD>::<TD class=gTableBody1 noWrap>3 vs 3</TD>::<TD class=gTableBody1 noWrap>CT WIN!</TD>::<TD class=gTableBody1 noWrap><B>1</B>-0</TD></TR>
::
<TR align=middle>
wcavtoid.txt:
Ness::1
Минус только 1: Нету защиты у бд...Полностью мой код(кроме таблицы,конечноже :) )
Прошу критику и прочее писать, мне интересно :D
P.S. Кому помог +
В отличие от некоторых других языков, оператор "+" делает конкатенацию, если хотя бы один операнд - строка, причем, не обязательно первый.
alert(+"123"+num);
Но как же быть, если нужно сделать конкатенацию имен переменных? Пример:
window["p_"+num+"_pos"]=2;document.getElementById("panel_"+num).style.display="block";
Dr.Brain
31.03.2010, 01:06
http://softrank.ru/im/10.JPG
Сегодня я раскажу как с помощю PHP, реализовать экранный анализатор!
Экранный анализатор - программа или скрипт, которая просматривает Web-страницу, извлекая при этом нужные данные.
Сейчас мы расмотрим простейший анализатор, который извлечет ссылки и отсортирует их по катеогориям!
И так, первым делом мы создадим форму что передаст нашему скрипту ссылку!
<?php
echo '<form method=get>
Ваша ссылка: <input name="url" type="text" value="http://">
</form>';
Теперь перейдём непосредственно к получению и обработке ссылки
if (isset($_REQUEST["url"])) { // проверяем наличие ссылки
$url = $_REQUEST["url"]; // получаем данные от формы
if (!preg_match('|^https{0,1}://|', $url)) { // С помощю регулярного выражения, проверяем ссылку
print "URL $url не является валидным!";
exit(0);
}
}
Самое время получить ссылки! Я буду использовать простую функцию file_get_contents(), потому-что в нашем случае использовать socket или curl безсмысленно!
$page = file_get_contents($url); // Получаем страницу
preg_match_all('|<a\s[^>]*href="([^"]+)"|i', $page, $match); // С помощю регулярки, вытягиваем все гиперссылки!
Теперь все гиперссылки находятся в массиве $match[1], а match[0] содержит все совпадения!
Можна инициализировать массивы, которые будем использовать для хранения и сортировки ссылок!
$all = array();
$js = array();
$full = array();
$local = array();
Получив все что нужно, начнём сортировку!
foreach ($match[1] as $link) {
if ($all[$link]) { // Все ссылки
continue;
}
$all[$link] = true;
if (preg_match('/^javascript:/', $link)) { // Регуляркой достаем JS ссылки
$js[] = $link;
} elseif (preg_match('/^https{0,1}:/i',$link)) { // Достаем полные ссылки
$full[] = $link;
} else {
$local[] = $link; // Остатки
}
}
Мы все сделали, осталось лишь вывести результат!
print '<table border=0>
<tr><td>Всего ссылок:</td><td>';
print strval(count($match[1])) . "</td></tr>";
print '<tr><td>Уникальных ссылок:</td><td>';
print strval(count($all)) . "</td></tr>";
print '<tr><td>Локальных ссылок:</td><td>';
print strval(count($local)) . "</td></tr>";
print '<tr><td>Полных ссылок:</td><td>';
print strval(count($full)) . "</td></tr>";
print '<tr><td>JavaScript ссылок:</td><td>';
print strval(count($js)) . "</td></tr>";
print '</table>';
?>
Вот и все!
В результате у нас получился вот такой скрипт:
<?php
echo '<form method=get>
Ваша ссылка: <input name="url" type="text" value="http://">
</form>';
$url = $_REQUEST["url"];
if (!preg_match('|^https{0,1}://|', $url)) {
print "URL $url не является валидным!";
exit(0);
}
$page = file_get_contents($url);
preg_match_all('|<a\s[^>]*href="([^"]+)"|i', $page, $match);
$all = array();
$js = array();
$full = array();
$local = array();
foreach ($match[1] as $link) {
if ($all[$link]) {
continue;
}
$all[$link] = true;
if (preg_match('/^javascript:/', $link)) {
$js[] = $link;
} elseif (preg_match('/^https{0,1}:/i',$link)) {
$full[] = $link;
} else {
$local[] = $link;
}
}
print '<table border=0>
<tr><td>Всего ссылок:</td><td>';
print strval(count($match[1])) . "</td></tr>";
print '<tr><td>Уникальных ссылок:</td><td>';
print strval(count($all)) . "</td></tr>";
print '<tr><td>Локальных ссылок:</td><td>';
print strval(count($local)) . "</td></tr>";
print '<tr><td>Полных ссылок:</td><td>';
print strval(count($full)) . "</td></tr>";
print '<tr><td>JavaScript ссылок:</td><td>';
print strval(count($js)) . "</td></tr>";
print '</table>';
?>
http://softrank.ru/1.PNG
Статья посвященная созданию ICQ бота на PHP языке!
Автор статьи я! Потому все связаные с ней вопросы ко мне!
Арсенал:
1) Хостинг или дедик
2) Знание PHP
3) Клас ICQ
4) ICQ номер бота
5) Руки
---Шаг первый---
Начнем с того что найдем клас для создания бота.
Этот клас сам разберется со всеми проблемами протокола ICQ и позволит нам подлючится к ICQ за несколько комманд.
Я выбрал mlCQ library v0.4 (Скачать все PHP скрипты сможете вконце темы)
Называем его lib.php и на время забываем.
---Шаг второй---
Создадим файл конфига conf.php!
В нем будут хранится разного рода настройки скрипта и бота.
Например ICQ и пароль бота, его статус и будет ли скрипт вести логи.
conf.php
<?php
DEFINE('UIN_ADMIN','ваша ася'); // Номер ICQ админа
// Уин бота
DEFINE('UIN_BOT','тут аська бота'); // Номер ICQ бота
DEFINE('PASS_BOT','тут пароль'); // Пароль от уина ICQ бота
// Настройки бота
DEFINE('BOT_STATUS','Статус бота X-Traz'); // X-Traz статус бота
DEFINE('BOT_BIRTHDAY','1'); // Шарик день-рождения
// Настройка логирования
DEFINE('LOG_SET','0'); // Если нужны логи поставте 1
DEFINE('LOG_FILE','huge.log'); // Файл логов
?>
Сохраняем в папке с lib.php и забываем!
---Шаг третий---
Перейдем к оболочке бота и скрипте что будет управлять всем функционалом!
Тут будет хранится скрипт входа в on-line, скрипт обработки и еще много чего!
Начнем с того что подключим lib.php и conf.php!
bot.php
<?php
require_once 'lib.php';
require_once 'conf.php';
Теперь определим параметр ICQ birthday, логов и запустим бота
//Birthday
if(BOT_BIRTHDAY=='1') { $BD='BIRTHDAY'; } // Разбираемся с параметром Днюхи бота
//Прочее
set_time_limit(0); // На же не надо чтобы бот постоянно выходил из она?
ignore_user_abort(true); // Игнор аборта
//Подключение
$mlCQ=new mlCQ(); // Создаем клас
$mlCQ->create_identity("me",UIN_BOT,PASS_BOT); //Вводим параметры входа
$mlCQ->connect(); //Создаем подключение
$mlCQ->login(); // Логинимся
// Файл логирования
if(LOG_SET=='1') { $mlCQ->start_logging(LOG_FILE); } // Если нужно, наш клас будет вести логи
//X-Traz
$mlCQ->set_status(BOT_STATUS, $BD); //Статус бота
//Удаляем не нужные офлайн сообщения
$mlCQ->request_offline_messages();
$mlCQ->delete_offline_messages();
$still_there=true; $code='';
Ну а сейчас займёмся списком команд
$list = "Набирите команды что описаны ниже:
person admin - О админе
person you - О Вас
";
$personallist = array(
"admin" => "Админу вчера выполнилось 150 лет. Он живет в г.Черновцы и жрет пиццу",
"you" => "Вы видимо дядя что шяс сидит в асике"
);
$help='Вас приветствует ICQ Info BOT
Команды бота:
help - Вывод справки (её Вы сейчас читаете)
admin ваше_сообщение - Связь с админом
list - Список персонала
person чел - Инфа о нем *
';
Вот теперь самая сложная часть которая разместит в себе весь остаток кода!
while($still_there) {
if(!is_resource($mlCQ->sock) || feof($mlCQ->sock)) $still_there=false; // Проверка
if(!$code) sleep(1); // Спим
$code=$mlCQ->dance_for('me');
switch($code) { //Распознаем ответы
case 7:
$msg=$mlCQ->id['in_messages']['last']; //Получаем последнее сообщение
$from=$msg['uin']; // Аська с которой пришло сообщение
$cmd = explode(' ',$msg['text']); //С помощю explode разделяем сообщение на оболочку
switch($cmd[0]) { //Разбираем сообщение
// Функция вывода хелпа
case 'help':
$mlCQ->send_message($from,$help); // Шлем сообщение с хелпом
break;
// Общение с админом
case 'admin':
$mlCQ->send_message('UIN_ADMIN','Вам пришло сообщение от: '.$from.
'
Текст: '.$cmd.
'
Ответить: send '.$from.' ответ');
break;
// Общение с юзерами
case 'send':
$mlCQ->send_message($cmd[1],'От админа: '.$cmd);
break;
// Отправка листа с командами
case 'list':
$mlCQ->send_message($from,$list);
break;
// Отправка ответа с данными о персоне
case 'person':
$messa = $personallist[$cmd[1]];
if (isset($messa)) {
$mlCQ->send_message($from,"$messa");
} else {
$mlCQ->send_message($from,"Такой персоны не найдено");
}
break;
// Функция остановки работы бота
case 'stop':
if($from==UIN_ADMIN) {
$mlCQ->send_message($from,'Работа бота завершена');
$mlCQ->close(); //Закрываем соединение
}
break;
//Если ни одна из команд не найдена, пишем дефолт сообщение
default:
$mlCQ->send_message($from,"Для вывода справки по командам наберите \"help\" (без кавычек)");
break;
}
}
}
?>
Сохраняем как bot.php, и идем на хостинг
---Шаг четвертый---
Нам нужен хостинг под бота!
Я своего держу на bravohost.ru. Почему там?
Там можно редактировать настройку о том сколько может исполнятся скрипт + есть cron который будет перезапускать скрипт каждые 10 мин.
Если хотите делать на дедике, то устанавливайте любую сборку сервера и в настройках укажите любое нужное Время исполнения, через которое Ваш скрипт остановится (Т.е. Вам надо будет его запускать снова)
Выбрали? Идем на хост и заливаем скрипты.
На папку с скриптом (Если нужны логи) кладем права 777.
Теперь запускаем bot.php и скрипт не должен открыватся (Т.е. Зависнуть)
Добавляйте бота и общайтесь с ним.
Если же ошибка, значит где-то в коде проблема или с хостингом лажа.
Вот пак из скриптов, которые собраны по этой статье!
Там находится клас mlCQ. Конфиг и оболочка бота!
Скачать upwap.ru: Архив с скриптами (http://upwap.ru/848484)
---F.A.Q.---
Бот почему-то сам выходит из онлайна, надо его заново запускать
Нужно изменить тайм-лимит на исполнение скрипта.
Пишет ошибку при выполнении скрипта
Куча причин возможно.
Может быть аська и пароль бота не правильны или хостинг лажет, а может и в скрипте проблемма
Не входит в он-лайн
Пароль с асей могут быть не правильные. Или хостинг не позволяет
Очень долго отвечает бот
Хостинг возможно тупит, или Ваш бот очень загружен
http://softrank.ru/p.png
Сегодня я постараюсь расказать о том как сделать динамический индикатор выполнения задачи или просто progress bar!
Эта тема не претендует на звание статьи, но то что она девствительно нужна многим PHP программистам - это правда, потому прошу выделить ей отдельный топик.
Статья моя, и все вопросы касающиеся ее прошу задавать сдесь!
Я раскажу о том как сделать progress bar, который будет прослеживать любую задачу скрипта и динамически уведомлять юзера.
Постараюсь пошагово разьяснить все аспекты и помочь Вам в разборе скрипта.
А теперь о progress bar'e:
В некоторых случаях Вам может понадобится визуально представить на экране ситуацию связяную с выполнением скрипта.
В таком случае можно сделать вывод динамического индикатора выполнения задачи, что будет уведомлять пользователя о том, когда загрузится скрипт.
Существуют разные способы добится этого, с использованием лишь PHP, или с помощю JS, CSS, Ajax.
Тут я покажу несколько примеров что обьединяют PHP и CSS.
Начнем!
Progress bar - Легкая версия
Создадим простую, текстовую версию прогресс бара:
Выводим на экран сообщение что предупредит пользователя о загрузке скрипта
<?php
echo "Происходит загрузка скрипта";
ВЫ можете вписать свое сообщение, все на свой вкус..
Теперь реализуем цикл, который будет определять заданую задачу и выводить точку
while (true) {
// Ставим точку и чистим буфер, чтобы убедится, что результат будет выведен на экране
echo '.';
flush();
//Теперь спим 1 секунду и повторяем цикл
sleep(1);
}
?>
Если вы захотите использовать данный прогресс бар, Вам нужно будет заменить цикл while(true) на реальную проверку выполнения конкретной задачи.
Например существования файла или процес загрузки...
Вы можете реализовать нужный цикл с даным условием)
Progress bar - PHP + CSS версия
Создадим более сложную и более красивую версию:
Для начала создадим функцию, что будет создавать исходный вид полосы
<?php
function progressbar() {
// Создадим стиль CSS
echo "
<style>
#text {
position: absolute;
top: 100px;
left: 50%;
margin: 0px 0px 0px -150px;
font-size: 18px;
text-align: center;
width: 300px;
}
#barbox_a {
position: absolute;
top: 130px;
left: 50%;
margin: 0px 0px 0px -160px;
width: 304px;
height: 24px;
background-color: black;
}
.per {
position: absolute;
top: 130px;
left: 50%;
margin: 1px 0px 0px 160px;
font-size: 18px;
background-color: #ffffff;
}
.bar {
position: absolute;
top: 132px;
left: 50%;
width: 0px;
height: 20px;
margin: 0px 0px 0px -158px;
background-color: #0099ff;
}
.blank {
background-color: white;
width: 300px;
}
</style>
";
Теперь выведем начальный XHTML, что будет перезаписан позже
echo "
<div id='text'>Прелоадер</div>
<div id='barbox_a'></div>
<div class='bar blank'></div>
<div class='per'>0%</div>
";
Удостоверимся что результат выводится
flush();
}
Создадим функцию, которой передадим % в виде числа, а она просто будет генерировать правильный div
function update($percent) {
//Сначала обновляем переменную percent новым значением:
echo "<div class='per'>{$percent}%</div>\n";
//Теперь выводим полоску - bar и установим ее ширину в 3 раза больше.
echo "<div class='bar' style='width:",$percent * 3,"px'></div>\n";
//Опять чистим буфер
flush();
}
И закончим скрипт инициализацией функции progressbar() и имитацией деятельности (Обновляя последовательно результат)
progressbar();
//Имитируем деятельность. Команда usleep будет имитировать выполняемые строки кода
usleep(350000);
update(7);
usleep(1550000);
update(28);
usleep(10000000);
update(48);
usleep(3500000);
update(68);
usleep(30000);
update(71);
usleep(5000000);
update(74);
usleep(3500);
update(77);
usleep(350000);
update(100);
//Теперь все готово и вы можете выбрать вариант выводимого текста в финале
echo "мы загрузились...";
?>
Вот и все. Вы можете легко доделать скрипт под себя и свои сайты..
С уважением, MDxaker from Antichat!
http://softrank.ru/s.png
Сейчас я раскажу о том, как сделать "выделялку" части сайта, на которой находится юзер
Эта тема не претендует на звание статьи, потому прошу не писать глупые комменты о том что толку 0 и т.п.!
Запомните, толк всегда есть, даже если статья посвящена тому как нужно выгребать говно!
Статья моя, и все вопросы касающиеся ее прошу задавать сдесь!
Бредословие:
Хотя не для всех сайтов требуется многоуровневое меню, тем не менее, большинство сайтов обычно имеют, по крайней мере, несколько различных секций.
Часто на разных страницах имеется ссылка на страницы, предшествующая текущей в данной секции, и поэтому полезно выделять цветом ту секцию, в которой находится пользователь!
Навигация с выделеным цветом
Создадим функцию, что будет выделять цветом ту секцию в которой будет находится юзверь:
function lightsec($secarray) {
echo "<ul>\n";
//Перебираем весь массив, создавая основное меню
foreach($secarray as $section => $url) {
//Выводим ссылку на данную секцию, выделяя особыв стилем
$class = '';
if (strncmp($url, $_SERVER['PHP_SELF'], strlen($url)) == 0) {
$class = 'class="current";
}
echo "<li{$class}><a href=\"{$url}\">{$section}</a></li>\n";
}
echo "</ul>\n";
}
Теперь сделаем массив, содержащий имена всех секций и URL
$sections = array(
'news' => '/news',
'photo' => '/photo'
);
?>
И применяем код СSS
<style>
.current, .current a {color:red}
</style>
И вызываем функцию
<?php
lightsec($sections);
?>
Повторяю, что это не статья, а пособие с примерами как можно решить проблемму с которой сталкиваются не мало PHP программистов.
Я просто описал способ достижения цели которым сам пользуюсь и отписал про это сдесь чтобы и вы могли оценить!
//by m0Hze, переместил. Надеюсь больше отдельных тем, для имбо-скриптов не будет.
vBulletin® v3.8.14, Copyright ©2000-2026, vBulletin Solutions, Inc. Перевод: zCarot