• Страница 1 из 1
  • 1
Модератор форума: likbezz  
Скрипты и коды для юкоз - Форум аццкого кодера » Вопросы по верстке, дизайну, управлению и настройки модулей СMS от uCoz » Системные скрипты. Вопросы, решения, примеры при работе с системными функциями. » Изменение z-index´a uWnd при работе с несколькими окошками
Изменение z-index´a uWnd при работе с несколькими окошками
Дата: Суббота, 13.08.2011, 00:02 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


MaxL,
Quote (MaxL)
Скрипт сам создает id блоку вида _uwndTop1 или _uwndTop2 - как ему захочется.
В 99% случаях оба окна получают одинаковые id = _uwndTop1.

Кто вам сказал такую глупость ...
ID окну задаётся жестко и четко, и не меняется пока окно существует, и они не могут быть “одинаковые”.

Quote (MaxL)
Второе окошко вызывается из первого окошка - оно из за меньшего z-index прячется под первое окошко - нужно то наоборот.

... Ага ... так и есть ... (сарказм)







Пример (_uWnd.html)
...

Quote (MaxL)
Второй выход из ситуации, это воспользоваться опцией oncontent, вызвать функцию, которая изменит z-index блока.

- Это не “второй” .., а, скорее, последний ... типа “мы не ищем лёгких путей ...” ...

Quote (MaxL)
Как изменить z-index всплывающего U окна?

- просто стилями:
Code
#_uwndWnd3{z-index:99999999!important}

... или onload - из самого окна по ID. ...
Code
(function(){
var o=$('#miWindTest4').parents('div.xw-plain').parent()[0];
o.style.zIndex='999999';
alert('zIndex='+o.style.zIndex);
})();

... или задать класс и манипулировать стилями ....
Code
$('#miWindTest3').parents('div.xw-plain').parent()[0].className='myWind3';
Code
html div.myWind3{z-index:99999993!important}

- всё зависит от поставленной задачи ... вариантов много ...
...


...

...
P.S. Ссылка на пример в личке ...
В примере «http://likbezz.ru/_example/uwind/2010/part1/_uWnd_zindex.html» - вы не сможете переместить второе окно на задний план - оно будет всегда на переднем (организовано стилями) ...
А на странице «http://likbezz.ru/_example/uwind/2010/part1/_myWind_zindex.html» - окна будут именно в той последовательности, в которой пронумерованы ... (1,2,3,4) не зависимо от того в каком порядке будут открыты ...


Code
html div.myWind1{z-index:99999991!important}
html div.myWind2{z-index:99999992!important}
html div.myWind3{z-index:99999993!important}
html div.myWind4{z-index:99999994!important}

...

P.P.S. А в принципе, можно организовать любую последовательность, любого кол-ва окон (в разумных пределах) ...
...

Прикрепления: 7435433.png (30.5 Kb) · 7733255.png (18.0 Kb) · 2470183.png (16.7 Kb) · 5023777.png (28.4 Kb) · 1258928.png (15.4 Kb)

 
Дата: Суббота, 13.08.2011, 00:04 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


Q:
Quote (MaxL)
fflesh, огромное спасибо что откликнулся.
Просмотрел все у тебя в примере и убедился, что каждому блоку выдан свой id.
Но у меня все по другому. Второму блоку выдается тот-же id, что и первому.

Вот код вызова первого блока.

Code
<a  href="javascript://" onclick="new _uWnd('ajax1','','657','520', {autosize:false,modal:true,close:true,header:true, nomove:true,fixed:false,resize:false,alert:false,align:'left'  }, {xml:false,url:'_URL_'})">$TITLE$</a>

Quote (MaxL)

Он подгружает в себя html страницу товара в магазине.
Там же по клику по картинке на товар стандартным кодом от uCoz вызывается второе окошко.

Вот тот код, который обрабатывает работу картинок и по клику основной картинки вызывает еще одно всплывающее окно с набором картинок.
Он стандартный, поставляется в всех шаблонах к магазину.

Code
$IMGS_ARRAY_JS$
<script type="text/javascript">
function _bldCont(indx){
var bck=indx-1;
var nxt=indx+1;
if (bck<0){bck = allEntImgs$ID$.length-1;}
if (nxt>=allEntImgs$ID$.length){nxt=0;}
var imgs='';
if (allEntImgs$ID$.length>1){
for (var i=0;i<allEntImgs$ID$.length;i++){
var img=i+1;
if(allEntImgs$ID$[i][0].length<1){continue;}
if (i==indx){imgs += '<b class="pgSwchA">'+img+'</b> ';}
else {
imgs += '<a class="pgSwch" href="javascript://" rel="nofollow" onclick="_bldCont('+i+');return false;">'+img+'</a> ';
}
}
imgs = '<div align="center" style="padding:8px 0 5px 0; white-space:nowrap;overflow:auto; overflow-x:auto;overflow-y:hidden;"><a class="pgSwch" href="javascript://" rel="nofollow" onclick="_bldCont('+bck+');return false;">« Back</a> '+imgs+' <a class="pgSwch" href="javascript://" rel="nofollow" onclick="_bldCont('+nxt+');return false;">Next »</a> </div> ';}
var hght = parseInt(allEntImgs$ID$[indx][2]); if ($.browser.msie) { hght += 28; };
_picsCont = '<div id="_prCont" style="position:relative;"><img alt="" border="0" src="' + allEntImgs$ID$[indx][0] + '"/>'+imgs+'</div>';
new _uWnd('wnd_prv', "Изображения товара", 10, 10, { waitimages:300000, autosizewidth:1, hideonresize:1, autosize:1, fadetype:1, closeonesc:1, align:'center', min:0, max:0, resize:1, setid:'fuck' }, _picsCont);
}
</script>

Quote (MaxL)
Что же не так?


 
Дата: Суббота, 13.08.2011, 00:10 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


MaxL,
Quote (MaxL)
Но у меня все по другому. Второму блоку выдается тот-же id, что и первому.

Вы, видимо, не внимательно читаете.
... Либо не можете правильно распорядится полученной информацией ...
Ещё раз:
Первое: ID - это уникальный элемент на странице, тем более генерированный системным скриптом (но даже не в этом дело).
Второе: Если есть блок, значит им можно управлять. Так или иначе.

А как управлять - написано выше:
Quote (fflesh)
- просто стилями:
Code
#_uwndWnd3{z-index:99999999!important}

... или onload - из самого окна по ID. ...
Code
(function(){
var o=$('#miWindTest4').parents('div.xw-plain').parent()[0];
o.style.zIndex='999999';
alert('zIndex='+o.style.zIndex);
})();

... или задать класс и манипулировать стилями ....


Quote (MaxL)
Он подгружает в себя html страницу товара в магазине.
Там же по клику по картинке на товар стандартным кодом от uCoz вызывается второе окошко.

Так как окно второе - первым - подгрузили - значит второе - следовательно его блок будет с ID == #_uwndTop2;
... идей нет? ...

Допустим, ссылка на открытия окна одна, и в окне картинка тоже одна - тогда просто стилями:
Code
#_uwndTop2,#_uwndWnd2{z-index:9999999!important}


Пример (_myWind_Array.html)
...

При других вариантах - лучше перестраховаться и назначить нужному окну - а “нужное” - это то, которое создаётся скриптом, (причём не лучшим ... о чём и писал - IMGS_ARRAY_JS и функция просмотра фоток материала. Оптимизируем - советую ознакомиться) - и назначить ему свой, определённый класс и через него уже осуществлять управление свойством z-index ....
Или, как вариант, назначить первому окну, изначально меньший - следовательно новое из этого окна будет выше по видимости....
Например:
Code
html div.myWinGrid{z-index:1!important} /* полупрозрачный модальный слой */
html div.myWindImg2{z-index:2!important} /* - наш блок */

Code
(function(){
var o=$('div.myWinCont').parents('div.xw-plain').parent()[0];o.className='myWindImg2';alert('className='+o.className);
})();


Пример (_myWind_Array.html) - ссылка «$TITLE$ v2» ...
...

Вариант другой - изменить немного скрипт открытия картинки, и назначать уже не родительскому окну, а окну с картинкой более высокий z-index. Опять же, через стили:
Code
html div.myWindImg3{z-index:9999999!important}

Code
function setWindClass(){var o=$('#_prCont').parents('div.xw-plain').parent()[0];o.className='myWindImg3';alert('className='+o.className);}

Code
oncontent:function(){setWindClass();}


Пример (_myWind_Array.html) - ссылка «$TITLE$ v3» ...
...


...

Если ещё немного посидеть, положив на работу, наверняка можно придумать ещё пару способов ... ヅ
...

P.S. Алерты были оставлены специально, дабы видеть когда и что происходит.
Проверено в мозилле, хроме и опере ... ИЕ под рукой нет ... пока.

P.P.S. Лично мне больше нравится последний вариант, так как он наиболее надёжный, и ... и красиво исполнен )
- Что не понятно - смотрим исходники - всё прозрачно.
...

Прикрепления: 7388428.jpg (66.8 Kb)

 
Скрипты и коды для юкоз - Форум аццкого кодера » Вопросы по верстке, дизайну, управлению и настройки модулей СMS от uCoz » Системные скрипты. Вопросы, решения, примеры при работе с системными функциями. » Изменение z-index´a uWnd при работе с несколькими окошками
  • Страница 1 из 1
  • 1
Поиск:


Мобильная версия