PHP.SU

Программирование на PHP, MySQL и другие веб-технологии

PHP.SU Портал

Главная

Помощь

Поиск

Поиск Яндекс Вакансии

Пользователи

Здравствуйте, Гость

( Вход · Регистрация · Правила форума )

Забыли пароль?

Одностраничный сайт

Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript (Модератор: armancho7777777)

Страниц (1): [1]

Описание: Помогите переписать скрипт

Поиск в теме | Версия для печати

ZekMan	Отправлено: 12 Июля, 2010 - 23:17:37
Новичок Покинул форум Сообщений всего: 28 Дата рег-ции: Июль 2010 Помог: 0 раз(а)	Про одностраничные сайты слыхали? Вот мне надо сверстать диз под него, вся проблема в том что у меня есть код для вертикального пролистывания, а мне нужно горизонтальное... Код под спойлером... Спойлер (Отобразить) CODE (html): скопировать код в буфер обмена <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Одностраничный сайт</title> <meta name="Keywords" content="" /> <meta name="Description" content="" /> <style type="text/css"> body, html { margin:0;padding:0; width: 100%; background: #eee; } h1 { padding: 0.5em 1em; margin: 0; } h2 { margin: 0; } ul.menu { list-style: none; margin: 0; padding: 5px; margin-bottom: 2px; background: #ddd; } .content { background: #eee; padding: 5px; } </style> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.3.2");</script> <script type="text/javascript">//<![CDATA[ var current_location_href; $(function() { if ($.browser.msie) { $(document.body).append('<iframe frameborder="0" style="width:0; height:0;" name="hist" src="hist.html?url=' + escape(self.location.href) + '"></iframe>'); } window.setInterval(function() { if (current_location_href != window.location.href) { if (document.frames && document.frames['hist']) { document.frames['hist'].window.location.href = 'hist.html?url=' + escape(self.location.href); } current_location_href = window.location.href; var sep_pos = current_location_href.indexOf('#'); var url = sep_pos >= 0 ? current_location_href.substring(sep_pos + 1) : ''; if ( ! url) { url = "main"; } if ( ! $("a[name=" + url + "]").next().is(":visible")) { $("div.layer").slideUp(); $("a[name=" + url + "]").next().slideDown(); } } }, 20); $("div.layer").hide(); }); //]]></script> </head> <body> <div class="content"> <a name="main"></a> <div class="layer"> <ul class="menu"> <li><a href="#">Главная страница</a></li> <li><a href="#about">Зачем это нужно</a></li> <li><a href="#contacts">Контакты</a></li> </ul> <h2>Добро пожаловать!</h2> <p>Это пример одностраничного сайта, простейший каркас, к котором Вы можете прикрутить большинство небольших сайтов.</p> <p>Так же это демонстрация простейшей реализации технологии перехода по ссылкам без перезагрузки страницы, при желании можно прикрутить подгрузку данных страниц через Ajax.</p> </div> <a name="about"></a> <div class="layer"> <ul class="menu"> <li><a href="#">Главная страница</a></li> <li><a href="#about">Зачем это нужно</a></li> <li><a href="#contacts">Контакты</a></li> </ul> <h2>Для чего нужен такой сайт</h2> <p>Исходный код этого сайта позволяет быстро сделать привлекательный информационный сайт с небольшим количеством статичных страниц.</p> </div> <a name="contacts"></a> <div class="layer"> <ul class="menu"> <li><a href="#">Главная страница</a></li> <li><a href="#about">Зачем это нужно</a></li> <li><a href="#contacts">Контакты</a></li> </ul> <h2>Контактная информация</h2> <p>E-mail: </p> </div> </div> </body> </html> Что поправить что бы не снизу выкатывался а слева или справа?

JustUserR	Отправлено: 13 Июля, 2010 - 02:26:07
Активный участник Покинул форум Сообщений всего: 8715 Дата рег-ции: Июнь 2009 Помог: 17 раз(а)	ZekMan пишет: Про одностраничные сайты слыхали? Вот мне надо сверстать диз под него, вся проблема в том что у меня есть код для вертикального пролистывания, а мне нужно горизонтальное... При разработке сайта с одной основной статической HTML-страницей и динамической загрузкой содержимого с помощью JS-скрипта и iframe-элемента можно сделать произвольный интерфейс - для создания эффектов прокручивания можно использовать собственные графические JS-эффекты или готовые HTML-фильтры http://brutka[dot]com/ru/img_filters.php Для обработки пролистывания можете установить обработчики события на onscroll и за счет приостановки ветвления стандартного события - выполнять собственную прокрутку за счет изменения scrollLeft/scrollTop в вашем отображающем div-слое ----- Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Безлимитный web-хостинг от 15 рублей за 40 МБ дискового пространства - http://ihost[dot]oks71[dot]ru/

ZekMan	Отправлено: 13 Июля, 2010 - 06:30:34
Новичок Покинул форум Сообщений всего: 28 Дата рег-ции: Июль 2010 Помог: 0 раз(а)	Это конечно хорошо но в JS и Jquery я не силен... Можешь дать примеры или подправить сам? буду очень благодарен...

Реф	Отправлено: 13 Июля, 2010 - 10:34:55
Частый гость Покинул форум Сообщений всего: 159 Дата рег-ции: Июль 2010 Откуда: Реутов, Россия Помог: 0 раз(а)	ZekMan Подправить то как раз не выйдет. Здесь используются стандартные эффекты slideDown() и slideUp(), за счёт них и достигается эффект вертикального прокручивания. CODE (javascript): скопировать код в буфер обмена if ( ! $("a[name=" + url + "]").next().is(":visible")) { $("div.layer").slideUp(); $("a[name=" + url + "]").next().slideDown(); } Для горизонатльного придётся что-то своё написать или потрясти инет, примеры плагинов с горизонатльной прокурткой довольно часто встречаются, но без элементарных понятий jQuery "выцепить" из них нужные строчки кода не выйдет. ----- Думать надо головой, а не головкой!

JustUserR	Отправлено: 14 Июля, 2010 - 03:05:34
Активный участник Покинул форум Сообщений всего: 8715 Дата рег-ции: Июнь 2009 Помог: 17 раз(а)	ZekMan пишет: Это конечно хорошо но в JS и Jquery я не силен... Можешь дать примеры или подправить сам? буду очень благодарен... Для реализации эффекта горизонтальной прокрутки вовсе не обязательно использовать фреймворк jquery - можно написать гораздо более эффективны функцию на чистом JS которая будет выполнять поставленное действие В частности после того как вы загружаете динамическое содержимое запрошенной страницы - вы можете создать в DOM-модели новый div-блок и скопировать в него полученное содержимое и добавить его на страницу справа от существующего блока в относительном позиционировании - а потом по таймеру выполнять движение блоков внутри содержащего их слоя с перекрытием overflow:hidden ----- Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Безлимитный web-хостинг от 15 рублей за 40 МБ дискового пространства - http://ihost[dot]oks71[dot]ru/

Поиск в теме | Версия для печати

Страниц (1): [1]

Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)

« JavaScript & VBScript »

Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.