Единый форум поддержки

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

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


Вы здесь » Единый форум поддержки » Новые возможности форумов » Обновленные награды


Обновленные награды

Сообщений 221 страница 240 из 310

221

Deff
И еще раз спасибо. Очень жаль что не могу еще плюсовать)

0

222

Подскажите как у подсказки стрелочку перекрасить?

http://savepic.ru/8457744.jpg

А то всё перекрасилось а стрелка чёрная

/*Cтиль Подсказки*/
.tipsy.awards {
margin-top:-22px!important;
opacity:.95!important;
}
.tipsy.awards  .tipsy-inner{
background: rgba(255,211,125,1)!important; /* Фон и прозрачность фона подсказки*/
}
.tipsy.awards .tipsy-inner {
font: normal normal 400 14px/normal "Georgia";
color:#3E2600;
box-shadow: 0 0 5px  rgba(139,114,34,1);
}

+1

223

Домовой
Стрелка поставлена через background-image на селектор .tipsy
Поменять мон, - ну типа так

.tipsy.awards{
  background:url(ссылка на картинку) bottom center no-repeat;
}

0

224

Домовой написал(а):

А то всё перекрасилось а стрелка чёрная

Мы чот с тобой делали со стрелкой - типо квадратом([s]span) повернутым на 45° во всплывающем минипрофиле
Вот как там:

tipsy.awards .tipsy-arrow,
tipsy.awards div.tipsy-inner {
padding:1px!important;
background:#B77415!important;  /*фон стрелки  и обрамления таблы*/
color:#513A01!important;
}
tipsy.awards  .tipsy-arrow{  /*Стрелка во всплывалке*/
margin-bottom:2px!important;
-moz-transform:rotate(45deg); /* Для Firefox */
-ms-transform:rotate(45deg); /* Для IE */
-webkit-transform:rotate(45deg); /* Для Safari, Chrome, iOS */
-o-transform:rotate(45deg); /* Для Opera */
transform:rotate(45deg);
height:7px!important;
width:7px!important;
z-index:-1;
}

}

+2

225

Deff, точно, я чот даже и не докумекал туда заглянуть))
Спасибо!
Ну и коль пошла такая пьянка, можно ли  как то переписать скрипт что бы всплывающей подсказки вовсе не было, а описание награды было в окне с самой наградой.
Ну как то так:

http://s3.uploads.ru/00J5g.jpg

Пытался подсказку сделать прозрачной и подогнать её куда надо, но при наведении на награды по очереди почему то меняется расположение текста.
Лучше бы конечно прямо в поле текст ставился без подсказки.

0

226

Домовой
Ссылку на форум с тестом наград

0

227

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

Ссылку на форум с тестом наград

http://alieparusa.mybb.ru

0

228

Домовой
Ни наю, может так:

<script>
$('.post li.pa-fld1>img').wrap('<span class="award-wrp"></span>');
$('.post li.pa-fld1>.award-wrp').each(function() {
  var img=$(this).find('img'),tit=img.attr('title'),left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  img.removeAttr('title');
  $(this).find('img').clone().appendTo($('<div class=awr-div></div>').prepend('<img class=xwost src="/i/blank.gif">'+tit).appendTo(this));
});
$('.award-wrp').one('mouseenter',function(){
  left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  $(this).find('img.xwost').css({'width':$(this).width()+'px','left':+left+'px'});
});
$('#pun-profile fieldset').each(function() {
  if ($(this).find('legend span').text() == 'Награды') {
    var h = '<table style="display: inline;">';
    $(this).find('p.checkfield').each(function() {
      var alt = $(this).find('img').attr('alt');
      var name = alt.substring(0, alt.indexOf('|'));
      var desc = alt.substring(alt.indexOf('|')+1);
      h += '<tr><td><p class="checkfield">' + $(this).html() + '</p></td><td>Награда: <strong>'+name+'</strong><br>Описание: <strong>'+desc+'</strong></td></tr>'
    });
    $(this).find('div.fs-box').html(h);
    $(this).find('div.fs-box').css({'display':'none'});
    $(this).find('legend').after('<span class=mywards onclick="$(this).parent().find(\'div.fs-box\').toggle(1000);">Выставить награды</span>');
  }
});
</script>

+1

229

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

Ни наю, может так:

Класс!
А под картинку текст нельзя переставить? И ещё, можно как то всплывающее окно с большой наградой привязать к маленьким наградам что постоянно в профиле видны. Ну как бы понятней объяснить. То есть если текст описания большой, то всплывающее поле увеличивается по высоте. А увеличение происходит вниз, то есть верхняя часть поля как бы привязана к одной точке. Тем самым перекрываются маленькие наградки. Вот было бы не плохо если бы низ был привязан к определённой точке, к примеру пиксел на 5 выше наградок, а верх пусть пляшет выше или ниже в зависимости от текста.
Фууух, скока бокаф накидал))

0

230

Домовой
1. Награды должны быть идентичные по размеру или ограничить их жестко при наведении - ширину и высоту
2. Тогда мон зафиксировать высоту и ширину у div.awr-div и сделать её position:relative; а картинку в ней абсолютной позицией

div.awr-div>img {
position:absolute; top:20px;/*величина отступа на две строки текста*/
}

Тады текст не будет влиять на картинку и шириину-высоту

0

231

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

Награды должны быть идентичные по размеру

А они и так все строго 150px по высоте. Размер поля меняется от текста. От количества символов.

0

232

Домовой

Домовой написал(а):

А под картинку текст нельзя переставить?

Код:
<script>
$('.post li.pa-fld1>img').wrap('<span class="award-wrp"></span>');
$('.post li.pa-fld1>.award-wrp').each(function() {
  var img=$(this).find('img'),tit=img.attr('title'),left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  img.removeAttr('title'); 
  $(this).find('img').clone().appendTo($('<div class=awr-div></div>').prepend('<img class=xwost src="/i/blank.gif">').appendTo(this));
  $(this).find('.awrd-div').append(tit);
});
$('.award-wrp').one('mouseenter',function(){
  left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  $(this).find('img.xwost').css({'width':$(this).width()+'px','left':+left+'px'});
});
$('#pun-profile fieldset').each(function() { 
  if ($(this).find('legend span').text() == 'Награды') { 
    var h = '<table style="display: inline;">'; 
    $(this).find('p.checkfield').each(function() { 
      var alt = $(this).find('img').attr('alt'); 
      var name = alt.substring(0, alt.indexOf('|')); 
      var desc = alt.substring(alt.indexOf('|')+1); 
      h += '<tr><td><p class="checkfield">' + $(this).html() + '</p></td><td>Награда: <strong>'+name+'</strong><br>Описание: <strong>'+desc+'</strong></td></tr>' 
    }); 
    $(this).find('div.fs-box').html(h); 
    $(this).find('div.fs-box').css({'display':'none'}); 
    $(this).find('legend').after('<span class=mywards onclick="$(this).parent().find(\'div.fs-box\').toggle(1000);">Выставить награды</span>'); 
  }
});
</script>

0

233

Alex_63
текста вообще нет

0

234

Домовой

<script>
$('.post li.pa-fld1>img').wrap('<span class="award-wrp"></span>');
$('.post li.pa-fld1>.award-wrp').each(function() {
  var img=$(this).find('img'),tit=img.attr('title'),left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  img.removeAttr('title');
  $(this).find('img').clone().prependTo($('<div class=awr-div></div>').append('<img class=xwost src="/i/blank.gif">'+tit).appendTo(this));
});
$('.award-wrp').one('mouseenter',function(){
  left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  $(this).find('img.xwost').css({'width':$(this).width()+'px','left':+left+'px'});
});
$('#pun-profile fieldset').each(function() {
  if ($(this).find('legend span').text() == 'Награды') {
    var h = '<table style="display: inline;">';
    $(this).find('p.checkfield').each(function() {
      var alt = $(this).find('img').attr('alt');
      var name = alt.substring(0, alt.indexOf('|'));
      var desc = alt.substring(alt.indexOf('|')+1);
      h += '<tr><td><p class="checkfield">' + $(this).html() + '</p></td><td>Награда: <strong>'+name+'</strong><br>Описание: <strong>'+desc+'</strong></td></tr>'
    });
    $(this).find('div.fs-box').html(h);
    $(this).find('div.fs-box').css({'display':'none'});
    $(this).find('legend').after('<span class=mywards onclick="$(this).parent().find(\'div.fs-box\').toggle(1000);">Выставить награды</span>');
  }
});
</script>

0

235

Домовой

Код:
<!-- Награды v3.1 by kozhilya transform -->
<style type="text/css">
.pa-fld1 .award-wrp{
display:inline-block!important;
vertical-align:bottom;
text-align:center;
cursor:pointer;
margin:4px;
}
.pa-fld1 img {
max-height:35px;
}
.pa-fld1{
max-width:100%;
margin:5px auto;
}
.post-author {
position:relative;
}
.pa-fld1 .award-wrp .awr-div {
left:3px;
background:rgba(248,207,127,.9); /* Фон и прозрачность фона для большой награды*/
padding:8px 0 0px 0;
border-radius:23px;
position:absolute;
z-index:100;
display:none;
margin-top:-230px;
margin-bottom: 12px;
width:94%;
border:#E5B352 solid 2px;
box-shadow:inset 0 0 5em #9C701C;
font-family:Georgia;
}
.pa-fld1 .award-wrp:hover .awr-div{
display:block;
}
.pa-fld1 .award-wrp .awr-div {
  width:200px;padding:3px 6px; height:188px;
}
.pa-fld1 .award-wrp .awr-div img{
 position:absolute!important;
 margin:auto; left:0;top:35px;right:0;bottom:0;
 margin:auto;
 border-bottom:6px solid transparent;
 max-height:160px;
}
.awr-div .xwost{
margin:auto;
top:100%;
margin-top:-3px;
margin-left:-3px;
position:absolute;
/*outline:red 1px solid;*/
height:35px;
}


/*Кнопка в Профиле*/
#pun-profile fieldset > span.mywards { 
background-image:linear-gradient(to bottom, #FFFCF3 0%, #E7CE95 100%);
border:1px solid #BD993E;
border-radius:4px;
cursor:pointer;
left:250px;
margin-bottom:4px;
padding:2px;
position:relative;
top:-26px;
}
</style>
<script>
$('.post li.pa-fld1>img').wrap('<span class="award-wrp"></span>');
$('.post li.pa-fld1>.award-wrp').each(function() {
  var img=$(this).find('img'),tit=img.attr('title'),left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  img.removeAttr('title'); 
  $(this).find('img').clone().appendTo($('<div class=awr-div></div>').prepend('<img class=xwost src="/i/blank.gif">'+tit).appendTo(this));
});
$('.award-wrp').one('mouseenter',function(){
  left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  $(this).find('img.xwost').css({'width':$(this).width()+'px','left':+left+'px'});
});
$('#pun-profile fieldset').each(function() { 
  if ($(this).find('legend span').text() == 'Награды') { 
    var h = '<table style="display: inline;">'; 
    $(this).find('p.checkfield').each(function() { 
      var alt = $(this).find('img').attr('alt'); 
      var name = alt.substring(0, alt.indexOf('|')); 
      var desc = alt.substring(alt.indexOf('|')+1); 
      h += '<tr><td><p class="checkfield">' + $(this).html() + '</p></td><td>Награда: <strong>'+name+'</strong><br>Описание: <strong>'+desc+'</strong></td></tr>' 
    }); 
    $(this).find('div.fs-box').html(h); 
    $(this).find('div.fs-box').css({'display':'none'}); 
    $(this).find('legend').after('<span class=mywards onclick="$(this).parent().find(\'div.fs-box\').toggle(1000);">Выставить награды</span>'); 
  }
});
</script>

+1

236

Alex_63" вообще караул))))
Сам посмотри КЛАЦ
Може пусть будет сверху? :D

0

237

Домовой
Ни наю - вверху лучше смотрится, (наверно так и оставить

0

238

Deff
отлично.

0

239

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

Ни наю - вверху лучше смотрится, (наверно так и оставить

Да мне уже понравилось))

0

240

И это снова я))
А можно сделать что бы окно с наградой открывалось не мгновенно а плавно?

Код:
<!-- Награды v3.1 by kozhilya transform -->
<style type="text/css">
.pa-fld1 .award-wrp{
display:inline-block!important;
vertical-align:bottom;
text-align:center;
cursor:pointer;
margin:4px;
}
.pa-fld1 img {
max-height:35px;
}
.pa-fld1{
max-width:100%;
margin:5px auto;
}
.post-author {
position:relative;
}
.pa-fld1 .award-wrp .awr-div {
left:3px;
background:rgba(248,207,127,.9); /* Фон и прозрачность фона для большой награды*/
padding:8px 0 0px 0;
border-radius:23px;
position:absolute;
z-index:100;
display:none;
margin-top:-237px;
margin-bottom: 19px;
width:94%;
border:#E5B352 solid 2px;
box-shadow:inset 0 0 5em #9C701C;
font-family:Georgia;
font-size:14px;
}
.pa-fld1 .award-wrp:hover .awr-div{
display:block;
}
.pa-fld1 .award-wrp .awr-div {
  width:200px;padding:3px 6px; height:188px;
}
.pa-fld1 .award-wrp .awr-div img{
 position:absolute!important;
 margin:auto; left:0;top:35px;right:0;bottom:0;
 margin:auto;
 border-bottom:6px solid transparent;
 max-height:160px;
}
.awr-div .xwost{
margin:auto;
top:100%;
margin-top:-3px;
margin-left:-3px;
position:absolute;
/*outline:red 1px solid;*/
height:35px;
}
 
 
/*Кнопка в Профиле*/
#pun-profile fieldset > span.mywards { 
background-image:linear-gradient(to bottom, #FFFCF3 0%, #E7CE95 100%);
border:1px solid #BD993E;
border-radius:4px;
cursor:pointer;
left:250px;
margin-bottom:4px;
padding:2px;
position:relative;
top:-26px;
}
</style>
<script>
$('.post li.pa-fld1>img').wrap('<span class="award-wrp"></span>');
$('.post li.pa-fld1>.award-wrp').each(function() {
  var img=$(this).find('img'),tit=img.attr('title'),left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  img.removeAttr('title'); 
  $(this).find('img').clone().appendTo($('<div class=awr-div></div>').prepend('<img class=xwost src="/i/blank.gif">'+tit).appendTo(this));
});
$('.award-wrp').one('mouseenter',function(){
  left=($(this).offset().left-$(this).parents('.post-author').offset().left);
  $(this).find('img.xwost').css({'width':$(this).width()+'px','left':+left+'px'});
});
$('#pun-profile fieldset').each(function() { 
  if ($(this).find('legend span').text() == 'Награды') { 
    var h = '<table style="display: inline;">'; 
    $(this).find('p.checkfield').each(function() { 
      var alt = $(this).find('img').attr('alt'); 
      var name = alt.substring(0, alt.indexOf('|')); 
      var desc = alt.substring(alt.indexOf('|')+1); 
      h += '<tr><td><p class="checkfield">' + $(this).html() + '</p></td><td>Награда: <strong>'+name+'</strong><br>Описание: <strong>'+desc+'</strong></td></tr>' 
    }); 
    $(this).find('div.fs-box').html(h); 
    $(this).find('div.fs-box').css({'display':'none'}); 
    $(this).find('legend').after('<span class=mywards onclick="$(this).parent().find(\'div.fs-box\').toggle(1000);">Выставить награды</span>'); 
  }
});
</script>

0


Вы здесь » Единый форум поддержки » Новые возможности форумов » Обновленные награды