Модальное окно всплывающее справа

[Rayn0r]

Приветствую!

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

Нашел вот такое окошко - http://jsfiddle.net/M3eAf/

Но есть проблема, оно нуждается в небольшой доработке

Мне нужно что бы я мог по ссылке на id открывать нужный мне div модального окна с этим id, т.е. другими словами, я хочу использовать модальные окна по несколько раз на странице. В данном случае я могу открыть только одно модальное окно с id - charms.

Помогите доработать скрипт, буду очень благодарен грамотному решению по данной проблеме.

[Diasouls]

Для начала уберите из css всё, что касается id(#). Это дурной тон, задавать стиль элементу через id (#) - используйте классы.

Стоит еще рассказать вам, что id - это уникальное обращение к элементу, то есть на странице, по логике вещей, не может быть два элемента с одинаковым id.

У вас же на странице два одинаковых id у блоков модуля.

Назовите первый блок id="charms", а второй id="charms2".

Измените ваш js в конце страницы на

$(function(){
	 $("#settings").click(function (e) {
		 e.preventDefault();
		 $('#charms').charms('showSection', 'theme-charms-section');
	 });
	 $("#test").click(function (e) {
		 e.preventDefault();
		 $('#charms2').charms('showSection', 'theme-charms-section');
	 });
});

После этого у вас все будет замечательно, при условии, что вы исправите самое первое замечание

Кстати, не обязательно использовать этот плагин, можно написать и самому на JQuery, намного короче.

Edited August 20, 2013 by Diasouls

[Rayn0r]

Для начала уберите из css всё, что касается id(#). Это дурной тон, задавать стиль элементу через id (#) - используйте классы.

Стоит еще рассказать вам, что id - это уникальное обращение к элементу, то есть на странице, по логике вещей, не может быть два элемента с одинаковым id.

У вас же на странице два одинаковых id у блоков модуля.

Назовите первый блок id="charms", а второй id="charms2".

Измените ваш js в конце страницы на

$(function(){
	 $("#settings").click(function (e) {
		 e.preventDefault();
		 $('#charms').charms('showSection', 'theme-charms-section');
	 });
	 $("#test").click(function (e) {
		 e.preventDefault();
		 $('#charms2').charms('showSection', 'theme-charms-section');
	 });
});

После этого у вас все будет замечательно, при условии, что вы исправите самое первое замечание

Кстати, не обязательно использовать этот плагин, можно написать и самому на JQuery, намного короче.

Спасибо за ответ.

Я сделал все как вы сказали, но проблема этим не решается. Дело в том, что скрипт написан и работает с #charms и если менять этот id на другой то скрипт просто не будет работать.

Да я согласен с вами, что в css прописывать стили для id это дурной тон и этого не стоит делать, я все это конечно перепишу, когда у меня будет готовый рабочий скрипт как мне надо. Спасибо.

[Rayn0r]

У кого то есть еще какие то идеи как можно переписать код что бы работало как нужно?

[Rayn0r]

Все товарищи. Все сделал. Спасибо всем, кто хоть зашел в эту тему и потратил несколько секунд своей жизни на мою проблему -)

[sansara0891]

21.08.2013 в 17:53, Rayn0r сказал:

Все товарищи. Все сделал. Спасибо всем, кто хоть зашел в эту тему и потратил несколько секунд своей жизни на мою проблему -)

как решили в итоге данную задачу?

[Rayn0r]

5 часов назад, sansara0891 сказал:

как решили в итоге данную задачу?

Это было 5 лет назад -)) Сейчас много подобных решений в инетрнете, я думаю не проблема найти похожее решение в инетрнете. Или самому написать.