Перейти к содержимому


Партнерская программа Kredov

Помогите с заменой шапки на слейдер

#1 Артур22

Артур22
  • Пользователь
  • 19 сообщений
  • Репутация: 6
0

Отправлено 18 Август 2012 - 22:16

Здравствуйте, делаю сайт http://free-store.ru.tf/
Хотел сделать анимированую шапку, в gif сами посмотрите на качество (на сайте}
Хотел заменить на флеш, не получилось, пытался сделать слайдер тоже не получилось
Помогите,как сделать слайдер изображений точно таких размеров вместо шапки?
Текст из html
<div class="header">
Из CSS
.header {
height: 274px;
background: #4b8bd9 url("../images/tophead.jpg") no-repeat 0 0;
padding: 0 8px 0 24px;
overflow: hidden;

 

 

  • 1

#2 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 18 Август 2012 - 22:58

https://www.google.r...iw=1920&bih=979
  • 0

#3 Артур22

Артур22
    Topic Starter
  • Пользователь
  • 19 сообщений
  • Репутация: 6

Отправлено 19 Август 2012 - 10:21

Проблема не в том что я не могу найти такой скрипт, а в том что я не могу его поставить
  • 1

#4 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 19 Август 2012 - 11:59

ну так конкретизируйте, какой именно скрипт, обычно в исходниках дается демо, просто тупо код оттуда копируете с поправками на свою верстку.
  • 2

#5 Артур22

Артур22
    Topic Starter
  • Пользователь
  • 19 сообщений
  • Репутация: 6

Отправлено 19 Август 2012 - 20:50

Вот примерно такой нужен http://www.rudebox.o...jquery-rudebox/
Как и куда его вставить чтоб точно также как шапка отоброжалься, и таких же размеров
  • 0

#6 Артур22

Артур22
    Topic Starter
  • Пользователь
  • 19 сообщений
  • Репутация: 6

Отправлено 21 Август 2012 - 20:18

Никто не знает чтоле?
  • 0

#7 Алия

Алия
  • Пользователь
  • 42 сообщений
  • Репутация: 10

Отправлено 22 Август 2012 - 20:55

1. Зайдите на указанный Вами сайт rudebox и, нажав на зеленую кнопочку, скачайте исходник.
2. Распакуйте содержимое скачанной заархивированной папки к себе на комп. Там всего четыре наименования: css, images, js и index.
3. Откройте папку js. В ней лежат два файла. Откройте в редакторе файл craftyside.min.js и измените в нём размеры var defaults width и height в соответствии с размерами Ваших картинок для шапки. Задайте "pagination":false, если хотите, чтобы слайдер листался автоматически, можно также изменить fadetime и delay.
4. В папке images лежит пять картинок для слайдера. Переименуйте Ваши картинки такими же названиями: 1.jpg, 2.jpg и т.д. Удалите содержимое папки images, (оставив только paginations.png, если слайды листаются вручную), и залейте в папку свои картинки.
5. Откройте код страницы index.html. Скопируйте в голову Вашей страницы, на которй Вы хотите разместить слайдер, строку <link rel="stylesheet" href="css/craftyslide.css" /> Если Ваша страница не в корне сайта, соответственно скорректируйте путь к файлу css.
6. Скопируйте в нужное место в теле Вашей страницы кусок кода, который начинается с <div id="slideshow"> и до конца тушки. Если Ваша страница не в корне сайта, соответственно скорректируйте путь к файлу js. Поменяйте надписи С Новым Годом на нужные Вам, а если надписи не нужны, удалите их.
7. Залейте папки css, images и js в корень Вашего сайта. Если нужно, скорректируйте css по Вашему усмотрению.
У меня все работает.
  • 1

#8 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 22 Август 2012 - 23:28

Алия,зачем так извращаться и лезть в исходный код, когда можно взять компактную версию скрипта, а настройки задать в объявлении, например в данном случае будет так:
<script>
    $("#slideshow").craftyslide({
        height: 274
    });
 </script>

  • 0

#9 Артур22

Артур22
    Topic Starter
  • Пользователь
  • 19 сообщений
  • Репутация: 6

Отправлено 23 Август 2012 - 00:10

Не получается у меня никак сделать, делаю по инструкции ноль толка, есть к примеру банальный java скрипт слайдера?
  • 0

#10 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 23 Август 2012 - 00:18

так ты задай правильный идентификатор, чтоб скрипт определил где отображать слайд шоу
в твоем случае это будет:
<script>
    $("#header").craftyslide({
	    height: 274
    });
</script>
во вторых убери лишние свойства из стилей идентификатора, в твоем случае это может быть как минимум
.header {
height: 274px;
padding: 0 8px 0 24px;
overflow: hidden;
}
в третьих проверь правильность путей
и в четвертом неужели под ДЛЕ нет готовых модулей, не поверю!





  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru