sadhaka
блин
спасибо, чот я сам не догадался до этого хд в прошлый раз ставил додумался поставить сами окна выше скрипта, а в этот раз не доперло хд
Техническая поддержка сервиса Quadro.Boards |
Новости сервиса |
О форуме
Quadro.Support – это форум технической поддержки различных проектов и сервисов Quadro.Systems LLC,
на котором грамотные технические специалисты всегда смогут помочь вам в решении проблем, или же подсказать ответы на самые сложные вопросы.
Так же на форуме собрана обширная база знаний по различным аспектам наших сервисов. Не забывайте пользоваться поиском ;)
|
Полезные ссылки |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Всплывающие окна с информацией
sadhaka
блин
спасибо, чот я сам не догадался до этого хд в прошлый раз ставил додумался поставить сами окна выше скрипта, а в этот раз не доперло хд
Выделенное зеленым - любой Ваш текст.
Это можно и ссылку на картинку?
То есть создается одно дополнительно поле, куда вставляется скрип, а остальное уже создаются новые страницы на нужно количество игроков? Попробуем.
Все вставила вышло вот это http://s6.uploads.ru/Z7aJD.png
.астрал
Пользователям заполнение запретили?
sadhaka
Упс, забыла, спасибо.
Отредактировано .астрал (12.12.2013 17:48:38)
sadhaka, последний вопрос, как убрать название
.астрал
Да, тег <h2> удалите
Здравствуйте, у нас небольшая беда)
Решили установить ваш код, но выходит что-то непонятное на разных профилях, а код один и тот же.
Более менее адекватно отображается на этом профиле http://pjredemption.rusff.me/profile.php?id=3
все вкладки работают и при нажатии хорошо отображается, но вот тут http://pjredemption.rusff.me/profile.php?id=21 при нажатие слишком сильно съезжает вниз, вкладки работают только один раз.
http://pjredemption.rusff.me/profile.php?id=21 вот тут вообще вкладки не работают, съезжают сильно вниз.
КОДЫ
вверх
полностью весь
<link rel="stylesheet" type="text/css" href="https://forumstatic.ru/files/0010/b4/f8/71526.css" /> <script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/78275.js"></script> <script>function PanelToggleL(a){var b=a.attr('data'),c=a.css('margin-left');a.attr('data',c);a.stop().animate({'margin-left':b},500)}</script> <style> #left-panel { top:300px; padding:0; margin-left:-225px; position:fixed;z-index:1000; left: 0px; } .content-L { padding:7px; width:190px; height:249px; margin-left:0px; margin-top:14px; position:absolute; color:#000; background-color: none; overflow: auto; } </style> <div data="0" id="left-panel"> <div class="content-L"> <div style="font-family: arial; letter-spacing: 1px; text-align: justify;"> <div style="font-family: nautilus pompilius; font-size: 14px; text-shadow: 1px 0px 0px #fff; text-align: center;"> погода в лагерях</div> <center>J - +23°C CHB - +30°C. </center> <div style="font-family: nautilus pompilius; font-size: 14px; text-shadow: 1px 0px 0px #fff; text-align: center; padding-top: 7px;"> игровое время</div> <center> август 2015 года. </center><br> в римском <b>лагере юпитера</b> все стабильно спокойно, на дежурстве у новоприбывших легионеров было зафиксировано прибавление в виде темноволосой девушки. пока её божественный родитель не дал о себе знать. в <b>лагере полукровок</b> бог вина готовиться к ежегодному параду радости и освобождения от назойливых детишек. лето же подходит к концу, почему бы не порадоваться? <br> <div style="font-family: nautilus pompilius; font-size: 14px; text-shadow: 1px 0px 0px #fff; text-align: center; padding-top: 7px;"> очередность квестов </div> <a href="ссылка">название квеста</a> ◆ Имя игрока <br> <a href="ссылка">название квеста</a> ◆ Имя игрока <br> </div></div> <img id="img-left" src="http://sa.uploads.ru/5wAJ3.png" onclick="PanelToggleL($('#left-panel'))"/> </div><!-- Конец Левой Панели --> <!-- черный title --> <!-- jquery уже подключен --> <script src="http://hostjs-mybb2011.narod.ru/js/transform_code_boxr.js"></script> <script type="text/javascript" src="http://your.roll.tv/16311.js"></script> <script type="text/javascript"> function to(username) {insert('[b]' + username + '[/b]' + ', ');} </script> <script type="text/javascript"> rusffLive.enable = false; </script> <style> .lastedit {display:none;} </style> <!-- HTML верх -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика --> <style>img.post-img-Sp {margin:0px;} div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner{font-size:14px;letter-spacing:1px; font-family: arial;} </style> <script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/57844.js"></script> <script src="http://hostjs-mybb2011.narod.ru/js/transform_code_boxr.js"></script> <script src="http://hostjs-mybb2011.narod.ru/js/transform_code_boxr.js"></script> <script src="https://forumstatic.ru/files/0011/e9/e1/56920.js" type="text/javascript"></script>
НИЗ
<script type="text/javascript"> function Transform_Code_Box_in_HTML(aX){ var TemLnk=aX.replace(/^(.*viewtopic\.php\?id=\d*).*$/ig,"$1"); var PstId=aX.replace(/^.*viewtopic\.php\?id=.*(#p\d+)$/ig,"$1"); var L=document.URL.replace(TemLnk,''); if(L!=document.URL&&(L.slice(0,1)).search(/\d/ig)==-1 ){ L=$("div.topic "+PstId); if(L.length==1){ var Lhtm=L.find(".post-content .code-box:first .scrollbox pre").text(); L.find(".post-content .code-box:first").replaceWith(Lhtm) }}} function Demo_HTML(Ts){var Ll=Ts.parents(".htmldemo").find(".code-box .scrollbox pre").text(); Ts.parents(".htmldemo").after('<div class="demHtml">'+Ll+'</div>');Ts.replaceWith(DemoButt0); } $(document).ready(function() { $("#pun-viewtopic .post .code-box").each(function(){ if($(this).text().indexOf('<!--HTML-->')!=-1){ $(this).wrap('<div class="htmldemo"></div>') $(this).replaceWith($('.htmldemo').text().split('<!--HTML-->')[1]); } }); }); </script> <script>var a,L,epl=$("#main-reply"),str='<small id="plng" style="border:1px solid;padding:2px 3px;margin:0 20px 0 10px;">Написано символов: <b>00</b> </small>';epl.parents("fieldset").find("legend").prepend(str);function epl3(){a=epl.val().length;if(a>9){L=''}else{L='0'};$("#plng b").text(L+a)};epl3();$(".pl-quote").click(function (){setTimeout('epl3()',100)});epl.bind('mouseout mousemove keydown keypress keyup',function(e){epl3()});</script> <script type="text/javascript"> PiarNik="sun chariot"; PiarPas="1111"; var L="<div id=\"PR_loginDiv\" style=\"display:none;\">\ <form id=\"form_login\" name=\"login\" method=\"post\" action=\"login.php?action=in\" onsubmit=\"return check_form()\">\ <fieldset>\ <input type=\"hidden\" name=\"form_sent\" value=\"1\"/>\ <input type=\"text\" id=\"fld1\" name=\"req_username\" size=\"21\" maxlength=\"25\"/>\ <input type=\"text\" id=\"fld2\" name=\"req_password\" size=\"7\" maxlength=\"16\"/>\ <input type=\"submit\" class=\"button\" name=\"login\"/>\ </fieldset>\ </form>\ </div>\ <li id=\"navpiar\"><span id=spMyimg><a onclick=\"PiarIn()\">Пиар-Вход</a></span></li>"; if($("#navlogin").html()!=null){ $("#navlogin").after(L) //navlogin $("#PR_loginDiv #fld1").val(PiarNik) $("#PR_loginDiv #fld2").val(PiarPas) function PiarIn () {$("#PR_loginDiv input[type='submit']").click();} } </script> <!--кнопки вверх вниз--> <div class="go-up" id='ToTop'><img src="http://sa.uploads.ru/lML7I.png" border="0" /></div> <div class="go-down" id='OnBottom'><img src="http://sa.uploads.ru/oswB3.png" border="0" /></div> <style> .go-up,.go-down { display:none; position:fixed; /*позиционируем*/ right:70px; /*указываем положение, если слева - left*/ z-index:9999; /*показываем поверх все элементов на странице*/ cursor:pointer; opacity:.5; /*прозрачность*/ margin-bottom:50px; /*отступ снизу (можно не указывать)*/ } .go-up { bottom:170px; /*положение от низа окна браузера верхняя кнопка*/ right: 90px; } .go-down { bottom:90px; /*положение от низа окна браузера нижняя кнопка кнопка*/ right: 90px; } .go-down:hover,.go-up:hover { opacity:0.9; } </style> <!--кнопки вверх вниз--> <script type="text/javascript"> $(function(){ if ($(window).scrollTop()>="250") $("#ToTop").fadeIn("slow") $(window).scroll(function(){ if ($(window).scrollTop()<="250") $("#ToTop").fadeOut("slow") else $("#ToTop").fadeIn("slow") }); if ($(window).scrollTop()<=$(document).height()-"999") $("#OnBottom").fadeIn("slow") $(window).scroll(function(){ if ($(window).scrollTop()>=$(document).height()-"999") $("#OnBottom").fadeOut("slow") else $("#OnBottom").fadeIn("slow") }); $("#ToTop").click(function(){$("html,body").animate({scrollTop:0},"slow")}) $("#OnBottom").click(function(){$("html,body").animate({scrollTop:$(document).height()},"slow")}) }); </script> <script type="text/javascript"> function select_text(elem) { if(window.getSelection) { var s=window.getSelection(); if(s.setBaseAndExtent){ s.setBaseAndExtent(elem,0,elem,elem.innerText.length-1); } else { var r=document.createRange(); r.selectNodeContents(elem); s.removeAllRanges(); s.addRange(r); } } else if(document.getSelection){ var s=document.getSelection(); var r=document.createRange(); r.selectNodeContents(elem); s.removeAllRanges(); s.addRange(r); } else if(document.selection){ var r=document.body.createTextRange(); r.moveToElementText(elem); r.select(); } } </script> <script type="text/javascript"> var div = document.getElementById('pun-main').getElementsByTagName('div'); for(x in div){ if(div[x].className=='code-box'){ div[x].getElementsByTagName('strong')[0].innerHTML = '<a href="#" onclick="select_text(this.parentNode.parentNode.childNodes[1].getElementsByTagName(\'pre\')[0]); return false;">Выделить</a>'; } } </script> <!--Своя картинка в каждую категорию --> <script type="text/javascript"> $(document).ready(function(){ myarray=new Array( "администраторская.", "http://sa.uploads.ru/mwySG.png" , "oчаг гестии.", "http://sa.uploads.ru/Loxsu.png" , "врата аида.", "http://sa.uploads.ru/df1Fr.png" , "зеркало афродиты.", "http://sa.uploads.ru/nvo2S.png" , "марсово поле.", "http://sa.uploads.ru/LpHM9.png" , "театр диониса.", "http://sa.uploads.ru/t7Re6.png" , "почта гермеса.", "http://sa.uploads.ru/LtC5o.png" , "молчание харона.", "http://sa.uploads.ru/d2LWO.png") $("#pun-index div.category h2,#pun-index #pun-stats h2").each(function (i) { for(q=0;q<myarray.length;q++){ var cssObj = { "height":"83px", "width":"1200px", "margin-left":"-180px", "margin-top":"20px", "margin-bottom":"-3px", "background-color": "transparent", "background-image":"url("+myarray[q+1]+")", "font-size": "0.0em", "background-repeat":"no-repeat" } if($(this).children("span").text()==myarray[q])$(this).css(cssObj); q++} }); }); </script> <script type="text/javascript"> var A=[1,2,3,4,5] $(".post .post-author li").each(function (){ for(var i=0; i<A.length;i++){if($(this).hasClass("pa-fld"+A[i])){ $(this).html($(this).html().replace(/^[^:]*:/,''));}};}); </script> <!-- HTML низ -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика --> <script> var a1 = 3 // 0 - спойлер-аккордеон, 1 - вертикальный спойлер; 3 - обычный спойлер var a2 = 0 // 0 - Скрытие первой вкладки; 1 - Показ первой вкладки; var a3 = 0 // Резкость Открытия: 0 - Плавно; 1 - Резко; var LiArr=new Array( //При наличии двух косых => // в начале пункта, - пункт не скрывается. //"pa-author", //Ник-Нейм //"pa-avatar", //Аватар //"pa-title", //статус // 1 кнопка - ссылка на Картинку //В квадратных скобках, прямо к ссылке можно добавить своё описание (по желанию) //"ссылка[Описание 1]", //"pa-reg", //Зарегистрирован //"pa-invites", //Приглашений //"pa-posts", //Кол-во сообщений: //"pa-respect", //Уважение: //"pa-positive", //Позитив //"pa-sex", //Пол //"pa-age", //Возраст //"pa-icq", //Аська //"pa-ip", //IP Юзера //"pa-time-visit", //Провел на форуме: //"pa-last-visit", //Последний визит: //"pa-online", //Пользователь online - Не засовываем в спойлеры // 2 кнопка- ссылка на Картинку //"ссылка", //"pa-from", //Откуда //"pa-fld1", //Доп.Поле.1 //3 кнопка- ссылка на Картинку "http://sa.uploads.ru/na6mG.png", //"pa-fld2", //Доп.Поле.2 //"pa-fld3", //Доп.Поле.3 //"pa-fld4", //Доп.Поле.4 //"pa-fld5", //Доп.Поле.5 "award", //Награды(только для rusff и ork) //"gift", //Подарки(только для rusff и ork) //Конец Списка, "_End"); SetProvilSpoil(a1,a2,a3); </script> <!--Конец//=Cпойлер cкрытия Инфы под N-кнопок в Профиле Топик--> <div id="reynaramirez" class="reveal-modal xlarge main container"> <h2>ИНФОРМАЦИЯ</h2> <p><style type="text/css"> .bcgrndt {width: 575px; height: auto; border: 3px solid #f8f8f8; background: url(http://www.housestay.biz/wp-content/uploads/2015/07/light-grey-wood-texture-edwuiteo.jpg); margin-top: 34px; margin-bottom: 10px;} .mimgt {text-align: center; border-radius: 50%; margin-bottom: 3px; margin-top: -40px; width: 60px; height: 60px;} .titlet {width: 520px; background-color: #f8f8f8; padding: 5px 0px 8px 0px; font: 16px Georgia; font-weight: bold; font-style: italic;} .qnamet {text-align: center; font: 1.1em Georgia; font-style: italic; padding: 6px 0px; margin-top: 10px;} .qlinett {width: 115px; padding: 2px; background-color: #f8f8f8; margin: 6px 0px 12px 50px;} </style> <div class="bcgrndt"><div style="width: 550px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;"> <center><div class="sacth"> <div class="sacthnuj"> <table> <tr> <td width="250px"><img src="https://media2.giphy.com/media/GFJFgxZz47kGs/100.gif" width="250px" style="border: 2px solid #600973;"> </td> <td><div align="right"><img src="http://funkyimg.com/i/28zmE.png" width="40px"><br> ❝0❞</div><br> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>Рейна Рамирез-Арельяно</b><br> Лагерь Юпитера | свет <br> <b>18</b> y.o. <br> <b>претор лагеря</b><br> </div> </td> </tr> </table><br> <div class="qnamet">никакой полукровка не исцелит ее душу.</div></div> <div style="width: 510px; height: 250px; padding: 20px; background-color: #d6cfc4;"><div class="tabs"> <div class="tab"><input type="radio" id="tab-1" name="tab-group-1" checked=""><label for="tab-1" style="margin-left: 33px;">СЕМЬЯ</label><div class="content"> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>САМЫЕ БЛИЗКИЕ</b> </div> <br> <div style="width: 350px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;">Беллона & Хилла & Адель & Шон <br> <img src="https://p.dreamwidth.org/0a6fd4bc07f1/-/i1054.photobucket.com/albums/s500/corelite/helena-arrow/Arrow_S01E07_Muse_of_Fire_1080p_KISSTHEMGOODBYE_NET_0641.png" class="dlust13"> <img src="http://cs622629.vk.me/v622629589/4d284/9xL2_U3nOfg.jpg" class="dlust13"><img src="http://40.media.tumblr.com/9f12396046fa158a13a3f327210a5434/tumblr_inline_nsa1q6rzrG1qffs3o_100.png" class="dlust13"> <img src="https://yt3.ggpht.com/-aaIjKljsvAQ/AAAAAAAAAAI/AAAAAAAAAAA/nMtOPWqg2ug/s100-c-k-no/photo.jpg" class="dlust13"></div></div></div> <div class="tab"><input type="radio" id="tab-3" name="tab-group-1"><label for="tab-3" style="margin-left: 25px;">КОНКУРСЫ/ПЛАШКИ</label><div class="content"> <div class="dlust8"><div class="dlust9">УЧАСТНИК КОНКУРСОВ</div><div class="dlust14"> <img src="ССЫЛКА НА МАЛЕНЬКУЮ КАРТИНКУ КОНКУРСА" title="УЧАСТВОВАЛ И МЕСТО"><br><br> <p> </p></div></div><div class="dlust17"><div class="dlust9" style="background-color: #f1eadc;">ПЛАШКИ</div> <div class="dlust16"> <p> </p><center><img src="http://s3.uploads.ru/Y8Lgq.png"<br>></center><br> </div></div></div></div></div></div> <div style="height: 15px;"></div> <style> .dlust14::-webkit-scrollbar {width: 05px;} .dlust14::-webkit-scrollbar-track {background-color: #ffffff;} .dlust14::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust16::-webkit-scrollbar {width: 05px;} .dlust16::-webkit-scrollbar-track {background-color: #ffffff;} .dlust16::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust8 { position: absolute; top: 0px; left: 0px; height: 205px; width: 230px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #d6cfc4; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; border-right: 5px solid #d6cfc4; } .dlust9 { background-color: #f1eadc; padding: 2px; font-family: calibri; font-size: 08px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #000000; margin-bottom: 05px; } .dlust13 { margin-top: 5px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; overflow: hidden; border: 5px solid #ffffff; width: 80px; } .dlust14 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; font-size: 13px; } .dlust16 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; } .dlust17 { background-color: #dddadc; position: absolute; top: 0px; right: 0px; height: 205px; width: 235px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #f1eadc; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; } .dlust18 { position: absolute; top: 120px; right: 10px; width: 230px; padding: 2px; text-align: center; font-family: calibri; text-transform: uppercase; color: #000000; font-size: 18px; line-height: 22px; } .tabs { position: relative; width: 460; height: 250; }.det15 { position: absolute; top: 205px; left: 10px; background-color: #ffffff; padding: 2px; font-family: calibri; font-size: 09px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #7b0d0d; margin-bottom: 05px; width: 230px; } .tab { float: left; } .tab label { display: block; background: #f1eadc; padding: 02px 18px; margin-left: -1px; position: relative; left: 1px; font-family: vernada; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: #5ff4a40; line-height: 08px; } .tab [type=radio] { display: none; } .content { position: absolute; top: 28px; bottom: 0px; left: 0px; right: 0px; background: #f1eadc; padding: 20px; height: 185px; } [type=radio]:checked ~ label { background: #f1eadc; color: #300d0d; border-bottom: 1px solid white; z-index: 2; } [type=radio]:checked ~ label ~ .content { z-index: 1; } </style> </center></div></p> <a class="close-reveal-modal">×</a> </div> <div id="adelegregory" class="reveal-modal xlarge main container"> <h2>ИНФОРМАЦИЯ</h2> <p><style type="text/css"> .bcgrndt {width: 575px; height: auto; border: 3px solid #f8f8f8; background: url(http://www.housestay.biz/wp-content/uploads/2015/07/light-grey-wood-texture-edwuiteo.jpg); margin-top: 34px; margin-bottom: 10px;} .mimgt {text-align: center; border-radius: 50%; margin-bottom: 3px; margin-top: -40px; width: 60px; height: 60px;} .titlet {width: 520px; background-color: #f8f8f8; padding: 5px 0px 8px 0px; font: 16px Georgia; font-weight: bold; font-style: italic;} .qnamet {text-align: center; font: 1.1em Georgia; font-style: italic; padding: 6px 0px; margin-top: 10px;} .qlinett {width: 115px; padding: 2px; background-color: #f8f8f8; margin: 6px 0px 12px 50px;} </style> <div class="bcgrndt"><div style="width: 550px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;"> <center><div class="sacth"> <div class="sacthnuj"> <table> <tr> <td width="250px"><img src="http://static.tumblr.com/hucnipc/7vXnwseyy/kat.png" width="250px" style="border: 2px solid #600973;"> </td> <td><div align="right"><img src="http://funkyimg.com/i/28zmD.png" width="40px"><br> ❝0❞</div><br> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>Адель Грегори</b><br> Лагерь полукровок | свет <br> <b>17</b> y.o. <br> <b>староста домика Дионы</b><br> </div> </td> </tr> </table><br> <div class="qnamet">Если прошёл дождь, то можно увидеть радугу. Так и после плохого обязательно будет что-то хорошее.</div></div> <div style="width: 510px; height: 250px; padding: 20px; background-color: #d6cfc4;"><div class="tabs"> <div class="tab"><input type="radio" id="tab-1" name="tab-group-1" checked=""><label for="tab-1" style="margin-left: 33px;">СЕМЬЯ</label><div class="content"> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>САМЫЕ БЛИЗКИЕ</b> </div> <br> <div style="width: 350px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;">Диона & Тиа & Рейна & Шон & <br> <img src="http://i26.photobucket.com/albums/c145/vampirefangirl/kgillan/karen44.png" class="dlust13"> <img src="http://s175.photobucket.com/albums/w148/bodachs/Holland%20Roden/holland_roden425.png" class="dlust13"><img src="http://images6.fanpop.com/image/photos/36700000/Adelaide-Kane-image-adelaide-kane-36742952-100-100.jpg" class="dlust13"> <img src="http://images4.fanpop.com/image/category/65/65192_1309638640_100_100.jpg" class="dlust13"></div></div></div> <div class="tab"><input type="radio" id="tab-3" name="tab-group-1"><label for="tab-3" style="margin-left: 25px;">КОНКУРСЫ/ПЛАШКИ</label><div class="content"> <div class="dlust8"><div class="dlust9">УЧАСТНИК КОНКУРСОВ</div><div class="dlust14"> <img src="ССЫЛКА НА МАЛЕНЬКУЮ КАРТИНКУ КОНКУРСА" title="УЧАСТВОВАЛ И МЕСТО"><br><br> <p> </p></div></div><div class="dlust17"><div class="dlust9" style="background-color: #f1eadc;">ПЛАШКИ</div> <div class="dlust16"> <p> </p><center><img src="http://funkyimg.com/i/28zjK.png"<br>></center><br> </div></div></div></div></div></div> <div style="height: 15px;"></div> <style> .dlust14::-webkit-scrollbar {width: 05px;} .dlust14::-webkit-scrollbar-track {background-color: #ffffff;} .dlust14::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust16::-webkit-scrollbar {width: 05px;} .dlust16::-webkit-scrollbar-track {background-color: #ffffff;} .dlust16::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust8 { position: absolute; top: 0px; left: 0px; height: 205px; width: 230px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #d6cfc4; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; border-right: 5px solid #d6cfc4; } .dlust9 { background-color: #f1eadc; padding: 2px; font-family: calibri; font-size: 08px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #000000; margin-bottom: 05px; } .dlust13 { margin-top: 5px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; overflow: hidden; border: 5px solid #ffffff; width: 80px; } .dlust14 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; font-size: 13px; } .dlust16 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; } .dlust17 { background-color: #dddadc; position: absolute; top: 0px; right: 0px; height: 205px; width: 235px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #f1eadc; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; } .dlust18 { position: absolute; top: 120px; right: 10px; width: 230px; padding: 2px; text-align: center; font-family: calibri; text-transform: uppercase; color: #000000; font-size: 18px; line-height: 22px; } .tabs { position: relative; width: 460; height: 250; }.det15 { position: absolute; top: 205px; left: 10px; background-color: #ffffff; padding: 2px; font-family: calibri; font-size: 09px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #7b0d0d; margin-bottom: 05px; width: 230px; } .tab { float: left; } .tab label { display: block; background: #f1eadc; padding: 02px 18px; margin-left: -1px; position: relative; left: 1px; font-family: vernada; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: #5ff4a40; line-height: 08px; } .tab [type=radio] { display: none; } .content { position: absolute; top: 28px; bottom: 0px; left: 0px; right: 0px; background: #f1eadc; padding: 20px; height: 185px; } [type=radio]:checked ~ label { background: #f1eadc; color: #300d0d; border-bottom: 1px solid white; z-index: 2; } [type=radio]:checked ~ label ~ .content { z-index: 1; } </style> </center></div></p> <a class="close-reveal-modal">×</a> </div> <div id="Fortuna" class="reveal-modal xlarge main container"> <h2>ИНФОРМАЦИЯ</h2> <p><style type="text/css"> .bcgrndt {width: 575px; height: auto; border: 3px solid #f8f8f8; background: url(http://www.housestay.biz/wp-content/uploads/2015/07/light-grey-wood-texture-edwuiteo.jpg); margin-top: 34px; margin-bottom: 10px;} .mimgt {text-align: center; border-radius: 50%; margin-bottom: 3px; margin-top: -40px; width: 60px; height: 60px;} .titlet {width: 520px; background-color: #f8f8f8; padding: 5px 0px 8px 0px; font: 16px Georgia; font-weight: bold; font-style: italic;} .qnamet {text-align: center; font: 1.1em Georgia; font-style: italic; padding: 6px 0px; margin-top: 10px;} .qlinett {width: 115px; padding: 2px; background-color: #f8f8f8; margin: 6px 0px 12px 50px;} </style> <div class="bcgrndt"><div style="width: 550px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;"> <center><div class="sacth"> <div class="sacthnuj"> <table> <tr> <td width="250px"><img src="http://savepic.ru/8810422.gif" width="250px" style="border: 2px solid #600973;"> </td> <td><div align="right"><img src="http://funkyimg.com/i/28zmC.png" width="40px"><br> ❝0❞</div><br> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>Тюхе | Фортуна</b><br> Бог | нейтралитет<br> <b>неизвестно, выглядит на 25</b> y.o. <br> <b>божество случая, удачи и судьбы | крупье в казино</b><br> </div> </td> </tr> </table><br> <div class="qnamet">«Фортуна не только слепа, но и любимцев своих ослепляет»</div></div> <div style="width: 510px; height: 250px; padding: 20px; background-color: #d6cfc4;"><div class="tabs"> <div class="tab"><input type="radio" id="tab-1" name="tab-group-1" checked=""><label for="tab-1" style="margin-left: 33px;">СЕМЬЯ</label><div class="content"> <div style="text-align: center; font: 11px arial; text-transform: none; line-height: 10px; line-height: 1.5;"> <b>САМЫЕ БЛИЗКИЕ</b> </div> <br> <div style="width: 350px; height: auto; background: #f1eadc; opacity: 0.95; -moz-border-radius: 10px; border: #5E412F dotted 2px; color: #121212; font-family: georgia; font-size: 11px; letter-spacing: 1px; font-style: italic; padding: 10px; text-align: justify; line-height: 110%;">Стикс & Ника & Плутос & Персефона <br> <img src="http://savepic.ru/8796106.png" class="dlust13"> <img src="http://savepic.ru/8788938.png" class="dlust13"><img src="http://savepic.ru/8846285.png" class="dlust13"> <img src="http://savepic.ru/8793034.png" class="dlust13"></div></div></div> <div class="tab"><input type="radio" id="tab-3" name="tab-group-1"><label for="tab-3" style="margin-left: 25px;">КОНКУРСЫ/ПЛАШКИ</label><div class="content"> <div class="dlust8"><div class="dlust9">УЧАСТНИК КОНКУРСОВ</div><div class="dlust14"> <img src="ССЫЛКА НА МАЛЕНЬКУЮ КАРТИНКУ КОНКУРСА" title="УЧАСТВОВАЛ И МЕСТО"><br><br> <p> </p></div></div><div class="dlust17"><div class="dlust9" style="background-color: #f1eadc;">ПЛАШКИ</div> <div class="dlust16"> <p> </p><center><img src="http://funkyimg.com/i/28zjz.png"<br>></center><br> </div></div></div></div></div></div> <div style="height: 15px;"></div> <style> .dlust14::-webkit-scrollbar {width: 05px;} .dlust14::-webkit-scrollbar-track {background-color: #ffffff;} .dlust14::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust16::-webkit-scrollbar {width: 05px;} .dlust16::-webkit-scrollbar-track {background-color: #ffffff;} .dlust16::-webkit-scrollbar-thumb {background-color: #d8bfb6;} .dlust8 { position: absolute; top: 0px; left: 0px; height: 205px; width: 230px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #d6cfc4; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; border-right: 5px solid #d6cfc4; } .dlust9 { background-color: #f1eadc; padding: 2px; font-family: calibri; font-size: 08px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #000000; margin-bottom: 05px; } .dlust13 { margin-top: 5px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; overflow: hidden; border: 5px solid #ffffff; width: 80px; } .dlust14 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; font-size: 13px; } .dlust16 { background-color: #f1eadc; padding: 5px; border-top: 5px solid #f1eadc; height: 175px; overflow: auto; } .dlust17 { background-color: #dddadc; position: absolute; top: 0px; right: 0px; height: 205px; width: 235px; padding: 10px; overflow: hidden; background-color: #f1eadc; color: #f1eadc; font-family: calibri; font-size: 10px; line-height: 10px; text-align: justify; } .dlust18 { position: absolute; top: 120px; right: 10px; width: 230px; padding: 2px; text-align: center; font-family: calibri; text-transform: uppercase; color: #000000; font-size: 18px; line-height: 22px; } .tabs { position: relative; width: 460; height: 250; }.det15 { position: absolute; top: 205px; left: 10px; background-color: #ffffff; padding: 2px; font-family: calibri; font-size: 09px; text-transform: uppercase; letter-spacing: 1px; line-height: 08px; text-align: center; color: #7b0d0d; margin-bottom: 05px; width: 230px; } .tab { float: left; } .tab label { display: block; background: #f1eadc; padding: 02px 18px; margin-left: -1px; position: relative; left: 1px; font-family: vernada; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: #5ff4a40; line-height: 08px; } .tab [type=radio] { display: none; } .content { position: absolute; top: 28px; bottom: 0px; left: 0px; right: 0px; background: #f1eadc; padding: 20px; height: 185px; } [type=radio]:checked ~ label { background: #f1eadc; color: #300d0d; border-bottom: 1px solid white; z-index: 2; } [type=radio]:checked ~ label ~ .content { z-index: 1; } </style> </center></div></p> <a class="close-reveal-modal">×</a> </div>
стайл
<style> <style> .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none; top: 0; left: 0; } .reveal-modal { visibility: hidden; top: 100px; left: 50%; margin-left: -300px; width: 520px; position: absolute; z-index: 101; padding: 30px 40px 34px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); -box-shadow: 0 0 10px rgba(0,0,0,.4); } .reveal-modal.small { width: 550px; margin-left: -350px;} .reveal-modal.medium { width: 550px; margin-left: -350px;} .reveal-modal.large { width: 550px; margin-left: -350px;} .reveal-modal.xlarge { width: 550px; margin-left: -350px;} .reveal-modal .close-reveal-modal { font-size: 22px; line-height: .5; position: absolute; top: 8px; right: 11px; color: #f1eadc; text-shadow: 0 -1px 1px rbga(0,0,0,.6); font-weight: bold; cursor: pointer; text-decoration: none; } </style>
tale
попробуйте вариант из этого поста
Всплывающие окна с информацией
Он проще.
В данном конкретном случае беда в незакрытых дивах. Вам необходимо проверить, что правильно вставляете код.
не актуально, проблема решена
Отредактировано Intro (10.08.2016 02:12:26)
не актуально, разобрались
Отредактировано Katrin Hartli (15.10.2017 20:26:46)
sadhaka
Здравствуйте, скажите, я так понимаю, это таблица, которую можно видоизменять? Можно ли ее украсить, вставив туда изображение? Просто я не совсем понимаю ,как это сделать. Помогите, пожалуйста. А то, пока что у меня так все простенько:
.reveal-modal-bg {
position: fixed;
height: 100%;
width: 100%;
background: #000;
background: rgba(0,0,0,.8);
z-index: 100;
display: none;
top: 0;
left: 0;
}
.reveal-modal {
visibility: hidden;
top: 100px;
left: 50%;
margin-left: -300px;
width: 520px;
position: absolute;
z-index: 101;
padding: 30px 40px 34px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
.reveal-modal.small { width: 200px; margin-left: -140px;}
.reveal-modal.medium { width: 400px; margin-left: -240px;}
.reveal-modal.large { width: 600px; margin-left: -340px;}
.reveal-modal.xlarge { width: 800px; margin-left: -440px;}.reveal-modal .close-reveal-modal {
font-size: 22px;
line-height: .5;
position: absolute;
top: 8px;
right: 11px;
color: #aaa;
text-shadow: 0 -1px 1px rbga(0,0,0,.6);
font-weight: bold;
cursor: pointer;
text-decoration: none;
}
Подскажите, как выровнять названия вкладок в одну линию?
Отредактировано Stefani (04.11.2018 20:25:41)
о форуме «Скрипты и дополнения» + навигация по скриптам | Скрипты и дополнения | 08.11.2010 |
Вопросы и Запросы по Скриптам 2 | Скрипты и дополнения | 25.04.2014 |
Вопросы по оформлению форума, дизайну и css (4) | Оформление форумов | 21.01.2016 |
Общие вопросы (6) | Поток сознания | 12.04.2015 |
Общие вопросы (7) | Поток сознания | 30.12.2015 |
Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Всплывающие окна с информацией