Назад
Создание прибыльного бизнеспроекта на базе сайта

SEO + ASP.NET 4.0 + БИЗНЕСМОДЕЛЬ = ПРИБЫЛЬНЫЙ САЙТ

Инструмент быстрого построения прибыльного онлайн бизнеса своими силами без капиталовложений за 4 месяца все подробности на SEO + ASP.NET 4.0.

Подписка на рассылку

МАГИЯ C#!

Создание вебсайта с формой автоматического приема онлайн платежей по WebMoney!
Ваше имя
Ваш e-mail
Уроки по ASP.NET c# ADO.NET
     

18 видеоуроков
более 5 часов
по созданию сайта,
выполняющего
продажи ваших продуктов (физических/электронных) на полном автомате с личным оповещением на e-mail, а также ...
DVD-курс по C#, .NET

3 часть. Введение в ASP.NET. WebServices Профессиональная подготовка разработчика по языку C# на платформе .NET

asp.net webservices dvd c# gridview Гудок курс Более 65 подробных видео уроков по теоретическим основам технологии сайтостроения ASP.NET и процессу создания и использованию вебсервисов.

DVD-курс по C#, .NET

2А часть. XML/TXT в аспекте ADO.NET Профессиональная подготовка разработчика по языку C# на платформе .NET

xml txt dvd c# ADO ADO.NET Гудок курс 70 подробных видео уроков по работе с форматами xml, txt, по работе с файлами и директориями. Разработка высокоорганизованных свойств для значительного сокращения объема исходного кода и облегчения дальнейшей модификации и многое-многое другое...

DVD-курс по C#, .NET

1 часть. Windows Forms Профессиональная подготовка разработчика по языку C# на платформе .NET

Профессиональная подготовка на c# А. Гудок

185 подробнейших уроков (70 часов) лекций в формате видеоуроков по теории языка c# и платформы .NET. Практическое закрепление теоретического материала на примере создания Windows Forms - приложения видеоигры "Tanks"

DVD-курс по C#, .NET

2 часть. ADO.NET/SQL Профессиональная подготовка разработчика по языку C# на платформе .NET

Профессиональная подготовка на c# А. Гудок ADO.NET sql

165 подробных видео уроков по созданию приложений распределенных баз данных на примере разработки проектов с использований технологий ADO.NET (Connected model, Disconnected model, Typed DataSet, ...)

Бодибилдинг
Программы тренировок для занятий штангой, гантелями; описание тренажеров

Я записываю курсы!
  Курс валют

НБУ курс евро






CSS3 динамический фон прокручиваемой страницы



Добрый день товарищи =).

Сегодня мы разберём очень простой и хитрый урок.

Наша задача менять футер по мере прокрутки страницы. Вот что мы будем реализовывать: Demo, Исходники. Только это дело надо смотреть не при дневном освещении - трудно разглядеть картинку подложки из-за её темных тонов.

Для начала на нужно создать html структуру страницы:

<!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>Think Geek Fade</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
	<div id="page-wrap">

		<div id="fancy-fancy">

			<div id="inner-wrap">
						blah blah.  

			</div>

		</div>

	</div>

</body>
</html>

Далее разберём CSS (но я полагаю тут всё просто):

* 		
{ 
   margin: 0; padding: 0;
}
body
{
   background: #404143 
   url(../images/bodytiletop.jpg) repeat-x;
}

#page-wrap
{
   background: 
   url(../images/bodytilebottom-tall.jpg) 
   repeat-x left bottom;
}

#fancy-fancy
{
   background: 
   url(../images/circlepattern.png) 
   fixed repeat-x -275px bottom;
}

#inner-wrap
{
   width: 550px; background: white; 
   margin: 0 auto; min-height: 2000px;
}

Ну и пробежим ещё раз по коду глазами и посмотрим логику у нас есть футер в png но сама картинка не простая изображения чёрно белое и имеет скрытые изображения.

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

Ну а на этом урок завершен.



Больше информации читайте по теме:



Оценить статью:

Оценивая статью, Вы подсказываете нам насколько данная информация стала полезной именно для Вас. Мы ожидаем, прежде всего, оценку доступности материала для понимания и простоты его изложения. Дополнительные комментари, вопросы, дополнения и замечания Вы можете указать на странице От Вас

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


            
        


        Ростислав    10.10.2010 15:29:09
        

Ну в качестве прямого применения вряд ли подойдет, а вот для других вещей данный пример стилей очень таки полезен. Весьма нестандартно




Имя:  


Текст комментариев (не больше 600 знаков):  
введите не более 600 знаков



Введите символы с картинки:
Капча имеет "срок годности". Поэтому, если необходимо обновите страницу.



Черный список покупателей
c# курс Гудок   курс по ASP.NET Гудок   курс по ADO.NET Гудок   курс по XML txt Гудок   курс по рефлексии и многопоточности Гудок