Авторские права © 2008-2009 - compupro.ru
© 2008-2009 - compupro.ru All rights reserved
Апр
22
Под патронажем ЮНЕСКО при участии 32 организаций-партнеров сегодня запущен один из самых амбициозных интернет-проектов - Мировая цифровая библиотека. 
На сайте www.wdl.org содержатся уникальные манускрипты, рукописи, редкие книги, фильмы, звукозаписи и фотографии. Цель этого проекта - перенести в Интернет культурное наследие всего человечества. Доступ ко всем ресурсам - бесплатный.
Источник: http://portal.unesco.org
Янв
14
После того как основные графические элементы для меню созданы, можно приступить к CSS верстке. Для этого в корневой директории, где будет находить файл index.html, создадим папку css. Внутри этой папки заведем еще одну папку images, в которую поместим три файла:
фон :
левая “крышка”:
правая “крышка” (длинная):
Эти три файла сохраним в папке css/images
Теперь приступим к созданию стилей. Ниже приведу css файл, который сохраним под именем style.css в папке css
.menu{
background: url(images/menu_bgr.png) repeat-x;
height: 40px;
list-style: none;
}
.menu li{
float:left;
}
.menu li a{
display: block;
color:#000;
text-decoration: none;
font-size: 13px;
font-family:sans-serif;
font-weight:bold;
padding:0 0 0 19px;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
}
.menu li a span{
display: block;
padding: 0 33px 0 14px;
}
.menu li.active a, .menu li a:hover{
color: #fff;
background: url(images/menu_left.png) no-repeat left;
}
.menu li.active a span, .menu li a:hover span{
color: #fff;
background: url(images/menu_right.png) no-repeat right top;
}
И, наконец, сама страница index.html, на которой будет отображаться меню:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel='stylesheet' href='css/style.css' type='text/css' media='all' />
</head>
<body>
<ul class="menu">
<li class="active"><a href="#"><span>Главная</span></a></li>
<li><a href="#"><span>Товары</span></a></li>
<li><a href="#"><span>Доставка</span></a></li>
<li><a href="#"><span>Контакты</span></a></li>
</ul>
</body>
</html>
Янв
2
Что будем печь
Сегодня мы с вами испечем вот такое меню:
Идея
Идея этого меню очень простая - при движении мыши по гиперссылке пункта меню благодаря псевдоклассу :hover происходит замена стиля и это пункт меню подсвечивается. Кроме этого есть класс current (текущий), в котором происходит подсветка активного на данный момент пункта меню. Поскольку названия пунктов меню могут быть разными по длине, необходимо сделать изображение, подсвечивающее пункт меню с запасом по длине.
Итак, мы имеем три состояния пункта меню:
1. Неактивное состояние
2. Текущее активное состояние
Создаем графику для меню (Adobe Photoshop)
Скачать видео-урок (в формате AVI)
Инградиенты:
Фон:
Левая часть подсвеченного пункта меню:
Правая часть подсвеченного пункта меню:
Ноя
7
Коллекция шаблонов впечатляет. Идею Open Source взяли на вооружение веб-дизайнеры. Каждый может добавить свой шаблон в эту копилку. По качеству многие шаблоны не уступают платным.
Сен
27
Наверное, вы уже видели такие сайты, текст на страницах которых можно читать, но нельзя скопировать в буфер обмена. Это как правило связано с охраной авторских прав. Одно из решений - использовать JavaScript. И тут опять на помощь приходит jQuery! Посколько jQuery позволяет манипулировать событиями и стилями, очень легко перехватить события мыши, и запретить выделение текста. В приведенной ниже ссылке это реализовано достаточно просто и изящно. Замечу, что текст лекго скопировать, открыв в блокноте исходный текст страницы. Это другая часть задачи защиты от просмотра.
P.S.Этот скрипт только лишь запрещает выделение текста, но не защищает его от просмотра и копирования.
Сен
15
1. Смена содержимого в виде горизонтальной прокрутки (карусель)
2. Простая смена контента при щелчке на закладках
3. Смена кадров происходит с мягких фэйдингом (проявлением) Демка
