один javaскрипт код на странице много раз
Вложений: 1
Доброго времени суток! не ругайте, пишу своими словами, как понимаю) помогите разобраться, как сделать чтобы один js код применялся ко всем элементам. скачал один простенький слайдер, хочу сделать на одной странице галерею таких слайдеров, 5-10 штук, копирую html код, но работает только один слайдер. помогите, до самого не доходит что нужно сделать
|
Animemia,
Простой выход из ситуации каждый голый сладер воткнуть на пустую страничку и эти странички поставить фреймом |
а если будущий сайт уже на joomla и каждый слайдер это отдельный материал ,а код js лежит в index.php. извиняюсь что сразу не сказал. как тогда быть?
|
Animemia,
Ну js во фрейме тожешь будет ? Один сладер - одна страница страницу с очередным слайдером указываете в src фрейма <iframe src="Ccылка на страницу с первым слайдером" width="468" height="60" frameborder="0" scrolling="no"></iframe> <iframe src="Ccылка на страницу со вторым слайдером" width="468" height="60" frameborder="0" scrolling="no"></iframe> Ну и т.д |
ЧТо то до меня не доходит что нужно сделать, вот у меня страничка, на которой выводится список материалов joomla, в каждом материале одинаковый html этого слайдера плюс описание к каждому свое. Работает только первый блок, слайдер. Может можно как то запихнуть js в каждый материал? Думаю так у меня все заработает, только как это сделать.
|
спасибо, попробовал с фреймами, все хорошо но joomla выводит не голый слайдер, а всю страницу. как с этим бороться? Получается мне нужно ссылку не на страницу а на сам слайдер,
|
Animemia,
Создайте отдельные страницы- голый слайдер Один слайдер - одна страница На этой странице точно такой же HTML как в zip файле в первом посте страница plugin.html , ток картинки свои больше никаких своих добавок - ни скриптов, ни css |
Animemia,
Слушай немножко чего говорить буду во всех дивах на странице с id="ppy1" стираешь это напрочь и заменяешь на class="ppy_max" вот так получиться должно <div class="ppy_max"> потом ищёшь файл jquery.popeye.style.css и там все #ppy1 заменяешь на .ppy_max и наконец меняешь запуск с $('#ppy1').popeye(options1);на $('.ppy_max').popeye(options1); и будет тебе счастье если всё аккуратно заменишь ... уффф ))) |
Добрый день.
Предлагаем к рассмотрению и тестированию наш проект - Маркетер Плагин. Продвигаем его успешно во всем мире. Но только 27 января 2013 предоставили в Рунете к тестированию русифицированный плагин с русифицированным интерфейсом. Вся подробная информация наhttp://www.marketerplugin.ru/ Предлагаем протестировать наш плагин на только что русифицированном интерфейсеhttp://www.marketerplugin.ru/test_plagina. В двух словах: плагин предназначен для создания сайтов-визиток и страниц продаж. Ждем ваших комментариев, отзывов и критики. Так же будем рады видеть вас на наших страницах в соц сетях http://www.facebook.com/pages/Marketer-plugin/5288148.. http://vk.com/club46912629 Успехов и новых впечатлений. С уважением, Богдан |
рони,
спасибо!)) вот об этом я и говорил)) все прекрасно теперь)) |
наверно нужно было новую тему, но вопрос опять же по этому слайдеру поэтому решил продолжить здесь. Почему под джумлой в файле php нормально этот скрипт работает только в firefox? webkit браузеры показывают бяку. не в стилях ведь дело?html файл ведь все браузеры нормально понимают
|
Цитата:
Нун править стили по классу, а не id |
интересно и что же там не так..(
всё ведь норм, а на joomla только один браузер мозила, странно как то.. |
Animemia,
стили правили некорректно копируйте код ниже и заменяйте свой на этот /* * jquery.popeye.style.css 2.1 * * Example styles for jQuery.popeye * * Copyright (C) 2011 Christoph Schuessler (schreib@herr-schuessler.de) * * This program is free software; you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation; either version 2 of the License, or * (at your option) any later version. * */ /* fallback styles for image list */ .ppy-imglist { width: 100%; display: block; overflow: hidden; } .ppy-imglist li { padding: 10px; border: 1px solid #f0f0f0; border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; background: #fff; list-style: none; float: left; display: block; margin: 0 10px 10px 0; } .ppy-imglist li a img { display: block; border: 0; } .ppy_max .ppy-extcaption { width: 240px; display: block; } .ppy_max .ppy-imglist li { width: 240px; height: 189px; } /* popeye example 1 */ .ppy_max.ppy-active { width: 262px; float: left; margin: 0 20px 10px 0; } .ppy_max .ppy-outer { padding: 10px; border: 1px solid #e1f1a1; border-radius: 0 10px 10px 10px; -moz-border-radius: 0 10px 10px 10px; -webkit-border-radius: 0 10px 10px 10px; background: #eff9c7; } .ppy_max .ppy-stage { width: 240px; height: 173px; border-radius: 0 5px 5px 5px; -moz-border-radius: 0 5px 5px 5px; -webkit-border-radius: 0 5px 5px 5px; cursor: pointer; } .ppy_max .ppy-outer:hover, .ppy_max.ppy-expanded .ppy-outer { border: 1px solid #d5e68e; box-shadow: 0 0 7px #ccc; -moz-box-shadow: 0 0 7px #ccc; -webkit-box-shadow: 0 0 7px #ccc; } /* .ppy_max .ppy-caption { margin: 5px 0 0 0; padding: 10px; font-size: 0.9em; line-height: 1.3em; color: #809f21; background: #eeffa8; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; box-shadow: 0 0 7px #ccc; -moz-box-shadow: 0 0 7px #ccc; -webkit-box-shadow: 0 0 7px #ccc; visibility: hidden; /* prevent flash of content before popeye loads */ } *//* .ppy_max .ppy-caption a { color: #66bde9; } .ppy_max .ppy-caption a:hover { text-decoration:underline; } */ .ppy_max .ppy-counter { border-bottom: 1px solid #d5e68e; color: #b8cf5a; padding: 0 0 2px 0; margin: 0 0 5px 0; font-size: 0.9em; } .ppy_max .ppy-stagewrap { background: #0c3b3d; border-radius: 0 5px 5px 5px; -moz-border-radius: 0 5px 5px 5px; -webkit-border-radius: 0 5px 5px 5px; } .ppy_max .ppy-loading { background: #0c3b3d url(../../gfx/popeye/loading1.gif) no-repeat center !important; } .ppy_max .ppy-nav { background: #0c3b3d; background: -moz-linear-gradient( center bottom, rgb(12,59,61) 0%, rgb(58,131,133) 100% ); width: 104px; height: 32px; padding: 5px; position: absolute; top: 0; left: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; } .ppy_max .ppy-nav a { display: block; overflow: hidden; text-indent: -900em; height: 22px; float: left; padding: 5px; border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; } .ppy_max .ppy-prev { width: 22px; background: url(../../gfx/popeye/prev3.png) no-repeat center; } .ppy_max .ppy-next { width: 22px; background: url(../../gfx/popeye/next3.png) no-repeat center; } .ppy_max .ppy-switch-enlarge { width: 30px; background: url(../../gfx/popeye/enlarge3.png) no-repeat center; } .ppy_max .ppy-switch-compact { width: 30px; background: url(../../gfx/popeye/compact3.png) no-repeat center; } .ppy_max .ppy-nav a:hover { background-color: #a1c436; cursor: pointer; } |
рони,
133 position: absolute; 134 top: 0; 135 left: 0; cложность собственно тут - слайдер прилеплен к левому верхнему углу почему фреймом и удобней |
Deff,
это никак невлияет на Цитата:
|
рони,
а в чем разница? код такой же как и был. |
Поэтому мозила только показывает нормально?
.ppy_max .ppy-nav { background: #0c3b3d; background: -moz-linear-gradient( center bottom, rgb(12,59,61) 0%, rgb(58,131,133) 100% ); width: 104px; height: 32px; padding: 5px; position: absolute; top: 0; left: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; } |
Цитата:
|
Вложений: 2
для наглядности, что у меня происходит в хроме (бяка), или же в мозиле-всё четко). только верхние два. таких слайдеров у меня будет больше 30.
|
Animemia,
скриншот сделайте "бяки", у меня во всех браузерах нормально показывает сразу три галереи на одной странице. |
добавил уже скрин. если открыть html то у меня тоже все норм, хоть 10 галерей, а вот если это все в файле index.php на joomla, то тут проблемы
|
Цитата:
|
Animemia,
ищите специалиста по css да и тому специалисту по месту надо смотреть. |
Часовой пояс GMT +3, время: 02:58. |