Слайд-шоу ... или поиск ночной музы :)

[ProRus]

Необъятное желание заставило меня разобраться с слайд-шоу, который пылился в закромах родины.

Слайд-шоу успешно подогнал под себя. Постарался понять большую его составляющую.

Откорректировал под него файлы css и javascript. Соответственно, на отдельной странице он успешно отображается.

Однако, возник вопрос, как при внедрении в необходимую область на главной странице, организовать css файл так, чтобы он касался именно той области, где находится слайд-шоу (иначе, стили, которые обозначены на всю главную страницу сбиваются)?

Возможно ли прописать дополнительный файл css к только необходимой области?

P.s. возможно вопрос не корректен или в меру глуп .. учусь, как могу

Edited July 21, 2011 by ProRus

[Int]

добавить ко всем селекторам спереди что-нибудь родительское.

[ProRus]

Спасибо! Удалось внедрить слайд-шоу. Помучатся всё равно пришлось, однако )

Уже подумал, что разобрался, но после внедрения возникла следующая проблема.

До внедрения слайд-шоу верхнее меню работало без проблем, наводишь - переключается на другую вкладку (меню выделено красной рамкой):

Посмотреть рабочее меню можно на главной сайта: _http://aiftour.com

После внедрения слайд-шоу верхнее меню перестало работать, происходит только подсветка выделенной области, а переключение отсутствует (так же, выделено красной рамкой):

Посмотреть меню после внедрения слайд-шоу можно на копии главной сайта: _http://aiftour.com/index2.html

Подскажите, пожалуйста, с чем это может быть связано? Сам пока что не разобрался.

[amelice]

Посмотреть рабочее меню можно на главной сайта: _http://aiftour.com

После внедрения слайд-шоу верхнее меню перестало работать, происходит только подсветка выделенной области, а переключение отсутствует (так же, выделено красной рамкой):

Посмотреть меню после внедрения слайд-шоу можно на копии главной сайта: _http://aiftour.com/index2.html

Подскажите, пожалуйста, с чем это может быть связано? Сам пока что не разобрался.

На вашем сайте после внедрения некоторые библиотеки скриптов не грузятся. Меню ваш работает с помощью скрипта, но мне не понятно с каким из них. Проверьте пути, возможно вот этот скрипт:

Невозможно загрузить исходный код для: http://aiftour.com/js/jquery.hoverIntent.js

Это мне выдает фаербаг.

[ProRus]

На вашем сайте после внедрения некоторые библиотеки скриптов не грузятся. Меню ваш работает с помощью скрипта, но мне не понятно с каким из них. Проверьте пути, возможно вот этот скрипт:

Невозможно загрузить исходный код для: http://aiftour.com/js/jquery.hoverIntent.js

Это мне выдает фаербаг.

Хм .. странно. Я ничего не изменял во всей структуре. Лишь только добавил доп. файлы.

Верхнее меню работает на основе _http://aiftour.com/top_menu.php .

Файлы всех скриптов находятся там, где и раньше ..

Не понимаю можно объяснить подробнее?

[amelice]

Хм .. странно. Я ничего не изменял во всей структуре. Лишь только добавил доп. файлы.

Верхнее меню работает на основе _http://aiftour.com/top_menu.php .

Файлы всех скриптов находятся там, где и раньше ..

Не понимаю можно объяснить подробнее?

Я извиняюсь, пропустила скрипт который у вас в head'е прописан.

Хотелось бы узнать что и как вы меняли?

Edited July 22, 2011 by cheburek

[ProRus]

Я извиняюсь, пропустила скрипт который у вас в head'е прописан.

Хотелось бы узнать что и как вы меняли?

Собственно, добавил после title:

<link rel="stylesheet" href="testslide/css/style.css" type="text/css" media="screen" charset="windows-1251" />

А так же, ликвидировал то, что видно на нормальной главной странице:

 <li>
                                <a href="/italy/about.html"><img src="/images/small_ital.jpg" height="135" width="203" alt="Италия" border="0" /></a>
                                <h3><a href="italy/about.html">Италия</a></h3>
                                <div class="clear"></div>
                                <p>Отдых в <strong>Италии</strong> - уникальный климат, богатые природных ресурсы и, конечно же, история <a href="/italy/about.html" rel="nofollow">дальше...</a></p>
                            </li>
                            <li>
                                <a href="/czech/about.html"><img src="/images/small_cze.jpg" height="135" width="203" alt="Чехия" border="0" /></a>
                                <h3><a href="czech/about.html">Чехия</a></h3>
                                <div class="clear"></div>
                                <p>Несомненно <strong>Чехия</strong> - страна с потрясающими пейзажами и памятниками архитектуры, окружение приветливых людей <a href="/czech/about.html" rel="nofollow">дальше...</a></p>            
                          </li>
                            <li class="no_margin_right">
                                <a href="/austria/about.html"><img src="/foto/turkey/tur07.jpg" height="135" width="203" alt="Турция" border="0" /></a>
                                <h3><a href="turkey/about.html">Турция</a></h3>
                                <div class="clear"></div>
                                <p>Наслаждение в <strong>Турции</strong> удивительными пляжами и культурой страны оставят особые впечатления <a href="/austria/about.html" rel="nofollow">дальше...</a></p>
                          </li>

И добавил в место, где был предыдущий код и то, что теперь видно на 2ой главной странице:

 <div id="page-wrap">

		<script type="text/javascript" src="testslide/js/jquery-1.2.6.js"></script>
	<script type="text/javascript" src="testslide/js/startstop-slider.js"></script>

		<div id="slider">

			<div id="mover">

				<div id="slide-1" class="slide">

					<h1>Италия</h1>

					<p>Уникальный климат, богатые природные ресурсы и, конечно же, история ...</p>

					<a href="http://www.aiftour.com/italy/about.html"><img src="images/slide-4-image.png" alt="learn more" /></a>

				</div>

				<div class="slide">




					<h1>Испания</h1>

					<p>Страна, визит в которую дарит открытия и сюрпризы, новые впечатления и краски, поражает красотой природы и причудливым разнообразием ...</p>

					<a href="http://www.aiftour.com/espania/about.html"><img src="images/slide-3-image.png" alt="learn more" /></a>

				</div>

<div class="slide">


					<h1>Чехия</h1>

					<p>Волшебный мир с потрясающими пейзажами и памятниками архитектуры, окружением приветливых людей ...</p>

					<a href="http://www.aiftour.com/czech/about.html"><img src="images/slide-2-image.png" alt="learn more" /></a>

				</div>




				<div class="slide">

					<h1>Турция</h1>

					<p>Наслаждение удивительными пляжами и культурой страны оставят особые впечатления...</p>

					<a href="http://www.aiftour.com/austria/about.html"><img src="images/slide-1-image.png" alt="learn more" /></a>

				</div>

			</div>

		</div>
	</div>

Предоставить полный код главной страницы?

[amelice]

Внимательно посмотрите что у вас было:

 <div class="content">
    <ul class="triada">  /* У списка были элементы li */      	
      <li>
        <a href="/italy/about.html"><img src="/images/small_ital.jpg" height="135" width="203" alt="Италия" border="0" /></a>
         <h3><a href="italy/about.html">Италия</a></h3>
         <div class="clear"></div>
         <p>Отдых в <strong>Италии</strong> - уникальный климат, богатые природных ресурсы и, конечно же, история <a href="/italy/about.html" rel="nofollow">дальше...</a></p>
      </li>
          .
          .
          .

</div>

и что стало:

<div class="content">
   <ul class="triada">              /* Вы убрали элементы списка li, но оставили сам список ul! Это неправильно.*/        	
     <div id="page-wrap">           /* */
      <script type="text/javascript" src="testslide/js/jquery-1.2.6.js"></script>
      <script type="text/javascript" src="testslide/js/startstop-slider.js"></script>
      <div id="slider">
       <div id="mover">
        <div id="slide-1" class="slide">
	  <h1>Италия</h1>
	  <p>Уникальный климат, богатые природные ресурсы и, конечно же, история ...</p>
	  <a href="http://www.aiftour.com/italy/about.html"><img src="images/slide-4-image.png" alt="learn more" /></a>
        </div>
         .
         .
         .
   </ul>

<link rel="stylesheet" href="testslide/css/style.css" type="text/css" media="screen" charset="windows-1251" />

В этом файле все стили описаны через ul.triada.

Попробуйте поменять ul на div в стилевом файле и в html. А вообще у вас же есть еще блок с #page-wrap, вот его и используйте.

Мне кажется из-за этого стилевого файла у вас не работает скрипт, который связан с главным меню, так как там тоже задействованы элементы ul.

Edited July 23, 2011 by cheburek

[amelice]

Кстати, в вашем стилевом файле style.css заметила такую ошибку:

ul.triada body {
    background: none repeat scroll 0 0 #222222;
    font-family: "Arial",Arial;
}

body - расположен после html! Он не перемещается со своего места.

[ProRus]

В этом файле все стили описаны через ul.triada.

Попробуйте поменять ul на div в стилевом файле и в html. А вообще у вас же есть еще блок с #page-wrap, вот его и используйте.

Мне кажется из-за этого стилевого файла у вас не работает скрипт, который связан с главным меню, так как там тоже задействованы элементы ul.

Что уже только не перепробывал .. и дополнительно div class приписывал, и убирал-добавлял как ul, так и li. Сделал сейчас всё через #page-wrap в .css (раньше уже пробывал) и всё равно проблема осталась ... ничего понять не могу

[ProRus]

Всё ещё актуально ...

[Softlink]

Переверстайте все заново и не надо париться. Стили слайдера можно вынести в отдельный файл. Не селектите по тегам, вешайте уникальные классы на все блоки. Перед тем как верстать, подумайте, что откуда у вас будет "расти". Это не сверхсложная задача, чтобы с ней так долго пыжиться. Имхо.

Edited July 26, 2011 by Softlink

[ProRus]

Переверстайте все заново и не надо париться. Стили слайдера можно вынести в отдельный файл. Не селектите по тегам, вешайте уникальные классы на все блоки. Перед тем как верстать, подумайте, что откуда у вас будет "расти". Это не сверхсложная задача, чтобы с ней так долго пыжиться. Имхо.

Как раз была потребность разобраться, в чём проблема, а не перековырять всю страницу, которая спокойно работает без добавления слайд-шоу.

Если не сверхсложная задача, отчего же ни кто ответа дать не может, в чём косяк?)

[buddah]

Если не сверхсложная задача, отчего же ни кто ответа дать не может, в чём косяк?)

Потому что чтобы дать однозначный ответ, надо иметь доступ к твоему фтп и экспериментировать, а не писать с головы "я думаю дело в этом"

Здесь какая-то мелочь, на поиски которой может уйти больше времени, чем на верстку заново.

[ProRus]

Потому что чтобы дать однозначный ответ, надо иметь доступ к твоему фтп и экспериментировать, а не писать с головы "я думаю дело в этом"

Здесь какая-то мелочь, на поиски которой может уйти больше времени, чем на верстку заново.

Ясно. Не просто верстать то, что написано чужими руками

Всем спасибо за помощь.

Можно закрывать.

Edited July 26, 2011 by ProRus