Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.02.2016, 14:34
Аватар для MariyaIgorevna
Новичок на форуме
Отправить личное сообщение для MariyaIgorevna Посмотреть профиль Найти все сообщения от MariyaIgorevna
 
Регистрация: 24.02.2016
Сообщений: 2

Как создать галерею с помощью jQuery
Всем привет!
Для моей фирмы очень нужен сайт. Мне его сделали. Посмотрев на результат, я начала изучать html и css. Прогресс - четыре дня занятий и готовы все страницы html и css. Теперь у меня загвоздка в том, что я хочу сделать на главной странице горизонтальную ленту из десяти фотографий. Просмотрела кучу сайтов и так делала, и эдак... Я вообще ничего не понимаю в этом и меня пугают страшные термины вроде "натравим плагин на объект" или подобные на английском... На компе пусто, пытаюсь скачать jQuery, не пойму вообще как это работает. Сохраняю как ссылку в папке с файлами будущего сайта, но так ничего не работает... В разрешениях брандмауэра не вижу ничего похожего на jQuery... Помогите пжл, объясните для абсолютного профана в этом деле!
Зашла вот сюда - сделала как написано - не работает....
http://dayte2.com/jcarousellite
Вот мои скрины.
Изображения:
Тип файла: jpg Слайд1.JPG (42.0 Кб, 3 просмотров)
Тип файла: jpg Слайд2.JPG (18.5 Кб, 2 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 24.02.2016, 14:56
Аватар для MariyaIgorevna
Новичок на форуме
Отправить личное сообщение для MariyaIgorevna Посмотреть профиль Найти все сообщения от MariyaIgorevna
 
Регистрация: 24.02.2016
Сообщений: 2

http://guazzo.ru/blog/web/jquery/sla...heniy-chast-1/ вот по этой странице тоже сделала - опять не получилось... скачала zip папки, указала путь к ним правильно, прикрепила вроде тоже верно... неделю сижу мучаюсь, на детей времени нет вообще, надоело до жути уже - отзовитесь кто-нибудь!
Изображения:
Тип файла: jpg Слайд1.JPG (33.9 Кб, 4 просмотров)
Тип файла: jpg Слайд2.JPG (33.5 Кб, 3 просмотров)

Последний раз редактировалось MariyaIgorevna, 24.02.2016 в 15:02.
Ответить с цитированием
  #3 (permalink)  
Старый 27.02.2016, 01:00
Аспирант
Отправить личное сообщение для olmensk Посмотреть профиль Найти все сообщения от olmensk
 
Регистрация: 24.02.2016
Сообщений: 33

Я просто в поисковике пишу "галерея на JQuery" и мне высвечивается 1000 ссылок сайтов где выложены миллионы галерей, смотри, выбирай, качай и переноси на свой сайт... и писать с нуля не надо, быстро и аккуратно.
Сам просто не пишу на JQ но встроить готовое решение, так делаю.

А есть галереи на чистом html и css, вообще без jq...
Ответить с цитированием
  #4 (permalink)  
Старый 27.02.2016, 01:15
Аспирант
Отправить личное сообщение для olmensk Посмотреть профиль Найти все сообщения от olmensk
 
Регистрация: 24.02.2016
Сообщений: 33

Попробую написать как делать с обычным стандартным html файлом. Не вордпресс, не друпал и не другие дипа движки, а просто обычным index.html

1) В папке сайта создаёте папку где будут лежать картинки которые будут в этом слайдере.

2) Открываете index.html, например Notepad++(м)(спец.редактор для таких дел) на крайний случай Блокнотом и в области <body></body> там где вы хотите поставить слайдер, создаёте новый div, называете его, что б можно было в css редактировать, а потом вообще внизу после всего, после всех дивов и тд страницы уже добавляете скрипт (но не после тега </body>) например так:

<html>

<head>
</head>

<body>
<!------------------------слайдер------------------->
<div class="slider1">
<div id="NewCarousel">
<ul>
<li><img src="/image/carousel-1.jpg"></li>
<li><img src="/image/carousel-2.jpg"></li>
<li><img src="/image/carousel-3.jpg"></li>
<li><img src="/image/carousel-4.jpg"></li>
<li><img src="/image/carousel-5.jpg"></li>
<li><img src="/image/carousel-6.jpg"></li>
</ul>
</div>
</div>
<!----------------------------------------------------->
<!------------------------скрипт--------------------->
<script type='text/javascript'>
$(function(){
$("#NewCarousel").jCarouselLite({
auto: 3000,
speed: 1500,
circular: true,
visible: 3
});
});
</script>
<!----------------------------------------------------->
</body>

</html>


Стили (красоту, размеры и тд) пишите уже в отдельном css файле.

1) А если захотите скрипт тоже вынести в отдельный файл (так делают если на странице ооочень много всего и что б не захломлять и страница не весила миллион мегабайт), тогда надо создать в Notepad новую страницу, и туда скопировать внутреннее содержимое что между <script></script> потом сохранить в папку сайта в расширении jquerry в папку где будут лежать скрипты, а в верхушке сайта где <head></head> прописать путь к этому файлу скрипта типа:
<script type="text/javascript" src="js/script.js"></script>

src="js/script.js" -это путь к файлу (js -название папки)(script.js -название файла с скриптом)

2) Если Вы скачали скрипт, тогда просто распаковывайте его и прописывайте в index.html к нему путь( в этом случае создавать страничку в блокноте и тд не надо, всё и так уже готово только путь укажи)


[head]
<script type="text/javascript" src="js/script.js"></script><!--скрипт (папка/файл)(на случай если хотите вынести отдельно)-->
[/head]                                                    <!--если скрипт вписан в index.html, тогда эта строчка ненужна-->

<div class="slider1"><!--div карусели-->
<div id="NewCarousel"><!--сама карусель-->
 <ul>
   <li><img src="/image/carousel-1.jpg"></li><!--картинка-->
   <li><img src="/image/carousel-2.jpg"></li>
   <li><img src="/image/carousel-3.jpg"></li>
   <li><img src="/image/carousel-4.jpg"></li>
   <li><img src="/image/carousel-5.jpg"></li>
   <li><img src="/image/carousel-6.jpg"></li>
 </ul>
</div>
</div>

[script type='text/javascript']<!--скрипт карусели внутри страницы-->
$(function(){
    $("#NewCarousel").jCarouselLite({
     auto: 3000,
     speed: 1500,
     circular: true,
     visible: 3
    });
});
[/script]


Важную роль ещё играет css, скрипты только приводят в движение всё, а вот css задаёт размеры, местоположение, узкий и высокий или широкий и маленький, позиционирование его относительно других обьектов сайта, вид картинок, местоположение кнопочек и переключателей, прозрачность и фон и тд...
Поэтому ищите, всё не так сложно как с первого взгляда кажется.
Но, Вам, мне кажется, достаточно будет указать размер слайдера div-а (.slider1) всё остальное автоматически подгонится, мне кажется, ну и естественно его месторасположение по вверх, лево, низ, право.

И по пути к картинкам, у Вас написано src="/image/carousel-1.jpg", а точнее /image/carousel-1.jpg, у меня было иногда картинки не виделись и перед / я ставил две точки или вообще убирал и / и ../ оставлял только src="image/carousel-1.jpg", но у Вас по учебнику поэтому думаю тут нормально всё, это я так, на всякий случай сказал про путь к картинкам.

PS:
То, что Вы скачали, судя по скринам, это архивы, то-есть файлы со скриптом запакованы архиватором ZIP, такое после скачивания надо распаковывать в произвольную папку которую вы отфанаря сделаете, после распаковки там будут текстовые файлы в расширении js (типа: script.js), это и есть скрипты, эти файлы надо будет скопировать в папку где будут лежать все скрипты сайта и уже после всего этого открывать "блокнотом" index.html и дальше прописывать к этим файлам путь, что б подключить их к сайту.


Надеюсь понятно расписал, удачи

Последний раз редактировалось olmensk, 27.02.2016 в 02:20.
Ответить с цитированием
  #5 (permalink)  
Старый 02.03.2016, 01:14
Новичок на форуме
Отправить личное сообщение для Zhenyakast Посмотреть профиль Найти все сообщения от Zhenyakast
 
Регистрация: 29.11.2015
Сообщений: 7

Как создать галерею с помощью jQuery
Всем доброго времени суток. Пробывал сам но неполучилось, посоветовали обратится сюда. Вопрос собственно в том, как новечку создать сервер lineage 2 freya сервер для игры по домашней локалке и что для этого нужно?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как прикрутить jquery галерею к angular? Проблема в href. ng-href не решает.? MOTORIST Angular.js 0 19.01.2015 15:23
Как передать переменную в функцию с помощью JQuery??? Иван Я Events/DOM/Window 3 20.01.2012 11:21
Как с помощью JQuery проверить длину введенного сообщения? Bandicoot jQuery 1 13.03.2011 14:12
JQUERY - как скачать данную библиотеку? Golovastik jQuery 7 06.03.2011 18:03
Как динамически изменить размер блока с флешкой из флешки с помощью jQuery Aleksandr_SAM Flash 3 30.11.2010 22:59