Техническая поддержка сервиса Quadro.Boards

Объявление

Новости сервиса

О форуме

Quadro.Support – это форум технической поддержки различных проектов и сервисов Quadro.Systems LLC, на котором грамотные технические специалисты всегда смогут помочь вам в решении проблем, или же подсказать ответы на самые сложные вопросы. Так же на форуме собрана обширная база знаний по различным аспектам наших сервисов. Не забывайте пользоваться поиском ;)

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Всплывающие окна с информацией


Всплывающие окна с информацией

Сообщений 21 страница 33 из 33

21

sadhaka
блин :D
спасибо, чот я сам не догадался до этого хд в прошлый раз ставил додумался поставить сами окна выше скрипта, а в этот раз не доперло хд

0

22

sadhaka написал(а):

Выделенное зеленым - любой Ваш текст.

Это можно и ссылку на картинку?

То есть создается одно дополнительно поле, куда вставляется скрип, а остальное уже создаются новые страницы на нужно количество игроков? Попробуем.

0

23

Все вставила вышло вот это http://s6.uploads.ru/Z7aJD.png

0

24

.астрал
Пользователям заполнение запретили?

0

25

sadhaka
Упс, забыла, спасибо.

Отредактировано .астрал (12.12.2013 17:48:38)

0

26

sadhaka, последний вопрос, как убрать название http://s6.uploads.ru/4G1bi.png

0

27

.астрал
Да, тег <h2> удалите

0

28

Здравствуйте, у нас небольшая беда)
Решили установить ваш код, но выходит что-то непонятное на разных профилях, а код один и тот же.
Более менее адекватно отображается на этом профиле 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%;">Беллона &amp; Хилла &amp; Адель &amp; Шон
<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%;">Диона &amp; Тиа &amp; Рейна &amp; Шон &amp;
<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%;">Стикс &amp; Ника &amp; Плутос &amp; Персефона
<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>

0

29

tale
попробуйте вариант из этого поста
Всплывающие окна с информацией

Он проще.

В данном конкретном случае беда в незакрытых дивах. Вам необходимо проверить, что правильно вставляете код.

0

30

не актуально, проблема решена

Отредактировано Intro (10.08.2016 02:12:26)

0

31

не актуально, разобрались

Отредактировано Katrin Hartli (15.10.2017 20:26:46)

0

32

sadhaka
Здравствуйте, скажите, я так понимаю, это таблица, которую можно видоизменять? Можно ли ее украсить, вставив туда изображение? Просто я не совсем понимаю ,как это сделать. Помогите, пожалуйста. А то, пока что у меня так все простенько: http://sh.uploads.ru/t/cQysR.png

.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;
}

0

33

Разобралась, не актуально. ;з

Подскажите, как выровнять названия вкладок в одну линию?

Отредактировано Stefani (04.11.2018 20:25:41)

0


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Всплывающие окна с информацией


Рейтинг форумов | Создать форум бесплатно