Скрытие скриптов. Нужна помощь!
Добрый день! Есть несколько функций модальных окон.
Как сделать, чтобы при вызове нового окна, закрывались все остальные? И так у каждого модального окна. |
Чтобы при открытии одного файла закрывались остальные файлы? Или чтобы при открытии одного окна закрывались остальные окна?
|
Чтобы при открытии одного js файла скрывались все остальные, не знаю просто как реализовать. :(
|
Просто у меня каждое окно реализовано в разных файлах, по сути, разницы нет, лишь бы окна (файлы) скрывались перед открытием другого окна.
|
Может все-таки не окна, а что-то типа панели? И если они открываются не ради просто открыть, то почему при уже открытой существует возможность открыть другие? Может все-таки не закрывать, а запрещать?
|
В том-то и беда, что при открытии нового окна (popup1.js), старое должно само скрыться (popup2.js).
|
Понятно, то есть это выбор в меню. Тогда вам уже советовали верное решение - выбросить четыре файла и написать один сценарий обслуживающий эту задачу. В нем и должна быть операция, которая закроет уже открытое, а откроет запрашиваемое.
PS. Если я правильно понял, то что у вас описано в нескольких файлах, это отображение содержимого, которое показывается у выбранной кнопки. Значит и речи о "закрытии открытого" можно не вести, ибо в данном случае лучше определить один объект, в который загружается запрошенное, и который смещается по вертикали относительно активной кнопке. |
Вот я и не знал как определить один объект, поэтому написал к каждой кнопке по окну и смещаю индивидуальными стилями.
$(function () { //script for popups $('a.show_popup_authors').click(function () { $('div.'+$(this).attr("rel")).fadeIn(500); $("body").append("<div id='overlay'></div>"); $('#overlay').show().css({'filter' : 'alpha(opacity=80)'}); return false; }); $('a.close').click(function () { $(this).parent().fadeOut(100); $('#overlay').remove('#overlay'); return false; }); $(document).click(function(e){ var e = e || window.event, x = e.srcElement || e.target; if (x != $('.popup_authors') && !$(x).parents(' .popup_authors').size() ) { $('.popup_authors').fadeOut(); $('#overlay').remove('#overlay'); } }); //script for tabs $("div.selectTabs").each(function () { var tmp = $(this); $(tmp).find(".lineTabs li").each(function (i) { $(tmp).find(".lineTabs li:eq("+i+") a").click(function(){ var tab_id=i+1; $(tmp).find(".lineTabs li").removeClass("active"); $(this).parent().addClass("active"); $(tmp).find(".tab_content div").stop(false,false).hide(); $(tmp).find(".tab"+tab_id).stop(false,false).fadeI n(300); return false; }); }); }); }); Значит вот в этом скрипте окна уже ничего не поменять, чтобы осуществить задачу и нужно все делать заново? |
Выбрасывайте. У объекта, в который помещается запрашиваемый контент должно быть все прописано в стилях, кроме позиции по вертикали. Нажатие кнопки меню - это запрос, помещение ответа в объект, получение позиции по вертикали (смещение) кнопки меню, и определение позиции объекта по вертикали как смещение кнопки меню + величина коррекции.
Единственное о закрытии, так это если щелчок вне меню, вот тогда закрыть открытое. |
Lucard IV,
а минимальный html вашего меню c css можно увидеть ? и зачем вам overlay? |
рони,
<div class="link_group_block"><a class="show_popup_objects" rel="objects" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ОБЪЕКТЫ</span></a></div> <div class="link_group_block"><a class="show_popup_sources" rel="sources" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ИСТОЧНИКИ</span></a></div> <div class="link_group_block"><a class="show_popup_authors" rel="authors" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">АВТОРЫ</span></a></div> Смотрите, overlay, чтобы при клике вне окна, оно закрывалось. laimas, Большое спасибо за дельные ответы, эх, реализовать бы еще, изначально знал, что мудрил сильно и делал не верно, но просто пока знаний не хватает, чтобы реализовать по другому, думал, что все можно решить проще. |
Вот, собственно CSS
.popup_objects { padding:20px 30px 20px; position:fixed; top: 140px; display:none; border:1px solid #f28c26; background:#fbfbfb; z-index:100; } .popup_objects:after, .popup_objects:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; z-index:100; } .popup_objects:after { border-color: rgba(251, 251, 251, 0); border-right-color: #fbfbfb; border-width: 15px; margin-top: -15px; z-index:100; } .popup_objects:before { border-color: rgba(242, 140, 38, 0); border-right-color: #f28c26; border-width: 16px; margin-top: -16px; z-index:100; } .popup_objects h2 { font-family: Scada, sans-serif; font-size: 22pt; color: #535558; text-align: left; margin-bottom: 5px; } .popup_objects a.close { width:10px; height:15px; display:block; text-indent:-9999px; position:absolute; top:10px; right:10px; background: url(../images/close_b.png) no-repeat; |
Lucard IV,
это кнопки а далее? Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Lucard IV,
смотрите тут http://javascript.ru/forum/jquery/54...tml#post362759 вам только изменить классы в коде на свои |
Прошу прощения, сейчас оформлю, как надо.
|
$(function () {
//script for popups
$('a.show_popup_objects').click(function () {
$('div.'+$(this).attr("rel")).fadeIn(500);
$("body").append("<div id='overlay'></div>");
$('#overlay').show().css({'filter' : 'alpha(opacity=80)'});
return false;
});
$('a.close').click(function () {
$(this).parent().fadeOut(100);
$('#overlay').remove('#overlay');
return false;
});
$(document).click(function(e){
var e = e || window.event,
x = e.srcElement || e.target;
if (x != $('.popup_objects') && !$(x).parents(' .popup_objects').size() ) {
$('.popup_objects').fadeOut();
$('#overlay').remove('#overlay');
}
});
//script for tabs
$("div.selectTabs").each(function () {
var tmp = $(this);
$(tmp).find(".lineTabs li").each(function (i) {
$(tmp).find(".lineTabs li:eq("+i+") a").click(function(){
var tab_id=i+1;
$(tmp).find(".lineTabs li").removeClass("active");
$(this).parent().addClass("active");
$(tmp).find(".tab_content div").stop(false,false).hide();
$(tmp).find(".tab"+tab_id).stop(false,false).fadeIn(300);
return false;
});
});
});
});
$(function () {
//script for popups
$('a.show_popup_authors').click(function () {
$('div.'+$(this).attr("rel")).fadeIn(500);
$("body").append("<div id='overlay'></div>");
$('#overlay').show().css({'filter' : 'alpha(opacity=80)'});
return false;
});
$('a.close').click(function () {
$(this).parent().fadeOut(100);
$('#overlay').remove('#overlay');
return false;
});
$(document).click(function(e){
var e = e || window.event,
x = e.srcElement || e.target;
if (x != $('.popup_authors') && !$(x).parents(' .popup_authors').size() ) {
$('.popup_authors').fadeOut();
$('#overlay').remove('#overlay');
}
});
//script for tabs
$("div.selectTabs").each(function () {
var tmp = $(this);
$(tmp).find(".lineTabs li").each(function (i) {
$(tmp).find(".lineTabs li:eq("+i+") a").click(function(){
var tab_id=i+1;
$(tmp).find(".lineTabs li").removeClass("active");
$(this).parent().addClass("active");
$(tmp).find(".tab_content div").stop(false,false).hide();
$(tmp).find(".tab"+tab_id).stop(false,false).fadeIn(300);
return false;
});
});
});
});
$(function () {
//script for popups
$('a.show_popup_sources').click(function () {
$('div.'+$(this).attr("rel")).fadeIn(500);
$("body").append("<div id='overlay'></div>");
$('#overlay').show().css({'filter' : 'alpha(opacity=80)'});
return false;
});
$('a.close').click(function () {
$(this).parent().fadeOut(100);
$('#overlay').remove('#overlay');
return false;
});
$(document).click(function(e){
var e = e || window.event,
x = e.srcElement || e.target;
if (x != $('.popup_sources') && !$(x).parents(' .popup_sources').size() ) {
$('.popup_sources').fadeOut();
$('#overlay').remove('#overlay');
}
});
//script for tabs
$("div.selectTabs").each(function () {
var tmp = $(this);
$(tmp).find(".lineTabs li").each(function (i) {
$(tmp).find(".lineTabs li:eq("+i+") a").click(function(){
var tab_id=i+1;
$(tmp).find(".lineTabs li").removeClass("active");
$(this).parent().addClass("active");
$(tmp).find(".tab_content div").stop(false,false).hide();
$(tmp).find(".tab"+tab_id).stop(false,false).fadeIn(300);
return false;
});
});
});
});
.link_group_block {
}
.link_group {
display: block;
font-family: Scada, sans-serif;
font-size: 16pt;
color: #6f7074;
}
.link_group a {
display: inline-block;
width:100%;
padding-top: 15px;
padding-bottom: 15px;
}
.link_group a:hover, .link_group a:focus, .link_group a:active {
width:100%;
background: #595a5d;
color: #cbcdd3;
padding-top: 15px;
padding-bottom: 15px;
}
/* Styles Popup Objects */
.popup_objects {
padding:20px 30px 20px;
position:fixed;
top: 140px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_objects:after, .popup_objects:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_objects:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_objects:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_objects h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
margin-bottom: 5px;
}
.popup_objects a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat;
}
/* Styles Popup Sources */
.popup_sources {
padding:20px 30px 20px;
position:fixed;
top: 170px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_sources:after, .popup_sources:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_sources:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_sources:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_sources h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
}
.popup_sources a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat;
}
/* Styles Popup Authors */
.popup_authors {
padding:20px 30px 20px;
position:fixed;
top: 180px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_authors:after, .popup_authors:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_authors:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_authors:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_authors h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
}
.popup_authors a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat;
}
<div class="popup_objects objects">
<a class="close" href="#">Close</a>
<h2>ОБЪЕКТЫ МОНИТОРИНГА</h2>
</div>
<div class="popup_sources sources">
<a class="close" href="#">Close</a>
<h2>ИCТОЧНИКИ</h2>
</div>
<div class="popup_authors authors">
<a class="close" href="#">Close</a>
<h2>АВТОРЫ</h2>
<input type="authors" placeholder="Начните вводить имя автора..." name="go" class="block-a">
</div>
<div class="link_group">
<div class="link_group_block"><a class="show_popup_objects" rel="objects" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ОБЪЕКТЫ</span></a></div>
<div class="link_group_block"><a class="show_popup_sources" rel="sources" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ИСТОЧНИКИ</span></a></div>
<div class="link_group_block"><a class="show_popup_authors" rel="authors" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">АВТОРЫ</span></a></div>
</div>
Вот |
рони,
Надеюсь, что действительно есть выход с простым изменением классов. |
Lucard IV,
открывашка 206 c css вы сами разберитесь - добавлен класс popup для блоков
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.link_group_block {
}
.link_group {
display: block;
font-family: Scada, sans-serif;
font-size: 16pt;
color: #6f7074;
}
.link_group a {
display: inline-block;
width:100%;
padding-top: 15px;
padding-bottom: 15px;
}
.link_group a:hover, .link_group a:focus, .link_group a:active {
width:100%;
background: #595a5d;
color: #cbcdd3;
padding-top: 15px;
padding-bottom: 15px;
}
/* Styles Popup Objects */
.popup_objects {
padding:20px 30px 20px;
position:fixed;
top: 140px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_objects:after, .popup_objects:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_objects:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_objects:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_objects h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
margin-bottom: 5px;
}
.popup_objects a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat #000000;
}
/* Styles Popup Sources */
.popup_sources {
padding:20px 30px 20px;
position:fixed;
top: 170px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_sources:after, .popup_sources:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_sources:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_sources:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_sources h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
}
.popup_sources a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat #000000;
}
/* Styles Popup Authors */
.popup_authors {
padding:20px 30px 20px;
position:fixed;
top: 180px;
display:none;
border:1px solid #f28c26;
background:#fbfbfb;
z-index:100;
}
.popup_authors:after, .popup_authors:before {
right: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index:100;
}
.popup_authors:after {
border-color: rgba(251, 251, 251, 0);
border-right-color: #fbfbfb;
border-width: 15px;
margin-top: -15px;
z-index:100;
}
.popup_authors:before {
border-color: rgba(242, 140, 38, 0);
border-right-color: #f28c26;
border-width: 16px;
margin-top: -16px;
z-index:100;
}
.popup_authors h2 {
font-family: Scada, sans-serif;
font-size: 22pt;
color: #535558;
text-align: left;
}
.popup_authors a.close {
width:10px;
height:15px;
display:block;
text-indent:-9999px;
position:absolute;
top:10px;
right:10px;
background: url(../images/close_b.png) no-repeat #000000;
}
.link_group span{
border-bottom: 1px dashed #595a5d; margin-left: 30px;
}
.active{
background: #595a5d;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
var $but = $(".link_group_block a"),
$blocks = $(".popup");
$but.each(function(i, elem) {
var $el = $(elem);
$el.click(function() {
$but.not($el).removeClass("active");
$el.toggleClass("active");
$blocks.each(function(j, el) {
$(el)["fade" + (i == j ? "Toggle" : "Out")]();
});
})
});
$('html, .close').click(function (event) {
if ($(event.target).closest('.link_group, .popup' ).size() && !$(event.target).is('.close')) return;
$but.filter('.active').click()
});
});
</script>
</head>
<body> <div class="popup_objects objects popup">
<a class="close" href="#">Close</a>
<h2>ОБЪЕКТЫ МОНИТОРИНГА</h2>
</div>
<div class="popup_sources sources popup">
<a class="close" href="#">Close</a>
<h2>ИCТОЧНИКИ</h2>
</div>
<div class="popup_authors authors popup">
<a class="close" href="#">Close</a>
<h2>АВТОРЫ</h2>
<input type="authors" placeholder="Начните вводить имя автора..." name="go" class="block-a">
</div>
<div class="link_group">
<div class="link_group_block"><a class="show_popup_objects" rel="objects" href="#"><span >ОБЪЕКТЫ</span></a></div>
<div class="link_group_block"><a class="show_popup_sources" rel="sources" href="#"><span >ИСТОЧНИКИ</span></a></div>
<div class="link_group_block"><a class="show_popup_authors" rel="authors" href="#"><span >АВТОРЫ</span></a></div>
</div>
</body>
</html>
|
рони,
Хорошо, сейчас попробую. |
рони,
Спасибо, все почти работает, но есть беда, при нажатии на первый пункт меню открывается следующий, при нажатии на следующий, открывается следующий вновь.( <div class="popup_objects objects popup"> <a class="close" href="#">Close</a> <h2>ОБЪЕКТЫ</h2> </div> <div class="popup_sources sources popup"> <a class="close" href="#">Close</a> <h2>ИCТОЧНИКИ</h2> </div> <div class="popup_leaders authors leaders"> <a class="close" href="#">Close</a> <h2>ЛИДЕРЫ</h2> </div> <div class="popup_authors authors popup"> <a class="close" href="#">Close</a> <h2>АВТОРЫ</h2> </div> <div class="popup_tonality tonality popup"> <a class="close" href="#">Close</a> <h2>ТОНАЛЬНОСТЬ</h2> </div> <div class="link_group"> <div class="link_group_block"><a class="show_popup_period" rel="period" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ПЕРИОД</span></a></div> <div class="link_group_block"><a class="show_popup_objects" rel="objects" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ОБЪЕКТЫ</span></a></div> <div class="link_group_block"><a class="show_popup_sources" rel="sources" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ИСТОЧНИКИ</span></a></div> <div class="link_group_block"><a class="show_popup_authors" rel="authors" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">АВТОРЫ</span></a></div> <div class="link_group_block"><a class="show_popup_leaders" rel="leaders" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ЛИДЕРЫ</span></a></div> <div class="link_group_block"><a class="show_popup_tonality" rel="tonality" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ТОНАЛЬНОСТЬ</span></a></div> </div>
<script>
$(function() {
var $but = $(".link_group_block a"),
$blocks = $(".popup");
$but.each(function(i, elem) {
var $el = $(elem);
$el.click(function() {
$but.not($el).removeClass("active");
$el.toggleClass("active");
$blocks.each(function(j, el) {
$(el)["fade" + (i == j ? "Toggle" : "Out")]();
});
})
});
$('html, .close').click(function (event) {
if ($(event.target).closest('.link_group, .popup' ).size() && !$(event.target).is('.close')) return;
$but.filter('.active').click()
});
});
</script>
.link_group_block {
}
.link_group {
display: block;
font-family: Scada, sans-serif;
font-size: 16pt;
color: #6f7074;
}
.link_group a {
display: inline-block;
width:100%;
padding-top: 15px;
padding-bottom: 15px;
}
.link_group a:hover, .link_group a:focus, .link_group a:active {
width:100%;
background: #595a5d;
color: #cbcdd3;
padding-top: 15px;
padding-bottom: 15px;
}
|
Lucard IV,
строка 11 где class popup |
Lucard IV,
да и кнопок 6 а блоков 5 |
рони,
Да, скопировал ошибочно, разбирался, дело в том, что один из блоков лежит в <div class="link_group"> <div class="link_group_block"><a class="show_popup_period" rel="period" href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ПЕРИОД</span></a></div> <div class="popup_period period popup"> <a class="close" href="#">Close</a> <h2>ПЕРИОД</h2> <form action=""> <div class = "period_data">Дата начала</div> <input type="text" value="" onfocus="this.select();lcs(this)" onclick="event.cancelBubble=true;this.select();lcs(this)"> <div class = "period_data">Дата окончания</div> <input type="text" value="" onfocus="this.select();lcs(this)" onclick="event.cancelBubble=true;this.select();lcs(this)"> </form> <a href="#" class="button_save"/>СОХРАНИТЬ</a> </div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ОБЪЕКТЫ</span></a></div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ИСТОЧНИКИ</span></a></div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">АВТОРЫ</span></a></div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ЛИДЕРЫ МНЕНИЙ</span></a></div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ТОНАЛЬНОСТЬ</span></a></div> <div class="link_group_block_normal"><a href="#tobeginsearch"><span style="color: #e58627; margin-left: 30px;">НАЧАТЬ ПОИСК</span></a></div> <div class="link_group_block_normal"><a href="#comments"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">КОММЕНТАРИИ</span></a></div> <div class="link_group_block"><a href="#"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ДАЙДЖЕСТ</span></a></div> </div> В другом блоке, поэтому по приоритету он последний, а в меню он первый, как быть, чтобы они не съезжали? |
рони,
popup_period В меню стоит первым, открывается внутри меню, а в итоге открывается по нажатию последней кнопки. :( А за скрипт и помощь огромное спасибо, вы меня выручили! |
Lucard IV,
добавьте обратно атрибут rel, связь ссылок будет через него с блоками, а не по индексу
$(function() {
var $but = $(".link_group_block a"),
$blocks = $(".popup");
$but.each(function(i, elem) {
var $el = $(elem), rel = '.'+$el.attr('rel');
$el.click(function() {
$but.not($el).removeClass("active");
$el.toggleClass("active");
$blocks.each(function(j, el) {
$(el)["fade" + ($(el).is(rel) ? "Toggle" : "Out")]();
});
})
});
$('html, .close').click(function (event) {
if ($(event.target).closest('.link_group, .popup' ).size() && !$(event.target).is('.close')) return;
$but.filter('.active').click()
});
});
|
рони,
Огромное спасибо! Все заработало как следует! Вы просто выручили меня! |
| Часовой пояс GMT +3, время: 11:24. |