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

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

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

Вы здесь » Единый форум поддержки » Корзина » Перекраиваем начисто

Перекраиваем начисто

Страница:   1 2

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

21

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28

slide
Коррекция ширины ток на главной

<style id=slide>
#pun {
padding: 0;
width : 100%;
}
</style>
<style>
#NEWS {
width:100%;
padding:0;
}
#NEWS td{
padding:0;
}
</style>
<script>if($(".punbb").attr("id")!="pun-index")$("style.#slide").replaceWith("")</script>

0

22

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

С применением этого кода:

<style id=slide>
#pun {
padding: 0;
width : 100%;
}
</style>

Границы таблиц "прижимаются" к самому краю экрана, как слева, так и справа. Это не есть хорошо. Нужен зазор в пол-сантимента, хотябы. Если сделать ширину форума, допустим, 85%, то границы таблиц слева и справа должны быть так же с отступом по ~5 мм от левого и правого краёв. Дело в том, что помимо фона таблиц, есть ещё и основной фон-подложка (назову его так). Этот основной фон полосатый по диагонали.

0

23

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28
slide написал(а):

Этот основной фон полосатый по диагонали.

Предыдущий код (пост 21) из HTML верх - Выкидываем (всё перенесли в скрипт)

Код:
<style id=slide>
#pun {
padding: 0;
width : 100%;
}
#pun-main{
padding-left:17px;
padding-right:17px;
}
#pun-announcement h2{
display:none;
}
#News_L11,
#News_R11 {
height:182px;
}
#News_L22,
#News_R22 {
height:295px;
}
#NEWS1,
#NEWS {
vertical-align:top;
width:100%;
padding:0;
}
#NEWS td{
padding:0;
}
</style>
<script>if($(".punbb").attr("id")!="pun-index")$("style.#slide").replaceWith("")</script>
     <div id=Inf_block_Left style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <div id=Inf_block_Right style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <script type="text/javascript">
if($(".punbb").attr("id")=="pun-index"){
    var str='<table id="NEWS1" cellspacing="0" cellpadding="0"><tbody><tr valign="top"><td id="td_NEWS1"></td></tr></tbody></table>';
    $("#pun-announcement").before(str);//alert($("#NEWS1").html())

divArray = new Array (
   "pun-announcement",
   "pun-status",
   "pun-break1",
   "pun-crumbs1",
   "pun-break2",
"End"
);//alert("A")

 var N=divArray.length-2;
  for(var i=0; i<=N+1; i++ ){
  // alert((N-i)+">>#"+divArray[N-i]);
   $("#"+divArray[N+1-i]).prependTo("#td_NEWS1")
  }
    var L=$("#Inf_block_Left").html();$("#Inf_block_Left").replaceWith("");
    var R=$("#Inf_block_Right").html();$("#Inf_block_Right").replaceWith("");


      var LeftSUM='', RightSUM='',block1='<div class="container" style="padding:1px;" id=News_';
      var block2="</div>";
    var c = L.split(/<h2>|<\/h2>/igm);//alert(c)
    
    i=1
    LeftSUM=block1+'L1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews1 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/

    $("#td_NEWS1").before(LeftSUM)
    i=3
    LeftSUM=block1+'L2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews2 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/


    var c = R.split(/<h2>|<\/h2>/igm);
    i=1;
    RightSUM=block1+'R1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews1 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/
    $("#td_NEWS1").after(RightSUM)
    i=3;
    RightSUM=block1+'R2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews2 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/


     $("#pun-main").html('<table width=100% id="NEWS2"><tr valign=top>'+LeftSUM+'<td>'+$("#pun-main").html()+'</td>'+RightSUM+'</tr></table>'); 
     $("#NEWS1").prependTo("#pun-main")
}
    </script>

0

24

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28

минус - один - высоту блоков при изменении контента в категории  Культура. Искусство. Духовность
И при изменения контента объявления - придецо устанавливать вручную ( не наю как автоматизировать для всех типов экрана
http://savepic.ru/2867732.png

#News_L11,
#News_R11 {
height:182px;
}
#News_L22,
#News_R22 {
height:295px;
}

(Надпись Объявление тож пришлось отключить - оно портит ширину верхней таблицы и высоту(Если нун - Напишите сами в контенте Объявы

Отредактировано Deff (Вс, 24 Июл 2011 03:21:07)

0

25

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

Deff,
давай по "понятиям" всё разложим:  :writing:

1. Фон-подложка. Он полосатый. На нём "лежит" основной фон, на котором, в свою очередь, "лежат" таблицы.
2. Основной фон. Он белый. Внутри некоторых ячеек — другой цвет, но это не суть.
3. Отступ таблиц. Речь ТОЛЬКО об отступе по вертикали (слева и справа) границ таблиц -внимание!- от ОСНОВНОГО фона (который белый).

Вот часть скрина моего стиля без всяких кодов. Так и должно остаться после введения кода для таблиц с новостями:

http://i25.fastpic.ru/big/2011/0724/7c/86d5e5633852b884fe4dcd3f3acf8a7c.gif

0

26

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

Ща ещё нарисую как в идеале это всё видится мне. =)) Млин... Или уже забьём?  :hobo:

Отредактировано slide (Вс, 24 Июл 2011 03:47:48)

0

27

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

По идее, ладно, пусть бы они - эти таблицы новостные - будут и между объявлением и статистикой. Но важно, чтобы по вертикали края (левый и правый) ВСЕХ таблиц были на ОДНОМ уровне... То есть, чтобы отступ, расстояние от левого/правого краёв всех(!) таблиц до края основного (белого) фона было одинаковым по всей высоте форума.

Отредактировано slide (Вс, 24 Июл 2011 03:56:55)

0

28

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28
slide написал(а):

3. Отступ таблиц. Речь ТОЛЬКО об отступе по вертикали (слева и справа) границ таблиц -внимание!- от ОСНОВНОГО фона (который белый).

slide :glasses: Требование - Не соотвецтвует первому скриншоту заказа!

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

Вот что требуется:
http://i25.fastpic.ru/thumb/2011/0723/56/7d6fa752c47bf525548ce2c0e50f6956.jpeg
То есть, нужно сделать так, чтобы слева и справа от главной таблицы (там где сам форум), были ещё таблицы для разного контента (календарь, новости и т.д. и т.п.) Это вопрос к Deff.

ПробуйтеЁ

Код:
<style id=slide>

#pun-announcement h2{
display:none;
}
#News_L11,
#News_R11 {
height:182px;
}
#News_L22,
#News_R22 {
height:295px;
}
#NEWS1,
#NEWS2 {
vertical-align:top;
width:100%;
padding:0;
}
#NEWS1 td,
#NEWS2 td{
padding:3px;
}
</style>
<script>if($(".punbb").attr("id")!="pun-index")$("style.#slide").replaceWith("")</script>
     <div id=Inf_block_Left style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <div id=Inf_block_Right style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <script type="text/javascript">
if($(".punbb").attr("id")=="pun-index"){
    var str='<table id="NEWS1" cellspacing="0" cellpadding="0"><tbody><tr valign="top"><td id="td_NEWS1"></td></tr></tbody></table>';
    $("#pun-announcement").before(str);//alert($("#NEWS1").html())

divArray = new Array (
   "pun-announcement",
   "pun-status",
   "pun-break1",
   "pun-crumbs1",
   "pun-break2",
"End"
);//alert("A")

 var N=divArray.length-2;
  for(var i=0; i<=N+1; i++ ){
  // alert((N-i)+">>#"+divArray[N-i]);
   $("#"+divArray[N+1-i]).prependTo("#td_NEWS1")
  }
    var L=$("#Inf_block_Left").html();$("#Inf_block_Left").replaceWith("");
    var R=$("#Inf_block_Right").html();$("#Inf_block_Right").replaceWith("");


      var LeftSUM='', RightSUM='',block1='<div class="container" style="padding:1px;" id=News_';
      var block2="</div>";
    var c = L.split(/<h2>|<\/h2>/igm);//alert(c)
    
    i=1
    LeftSUM=block1+'L1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews1 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/

    $("#td_NEWS1").before(LeftSUM)
    i=3
    LeftSUM=block1+'L2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews2 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/


    var c = R.split(/<h2>|<\/h2>/igm);
    i=1;
    RightSUM=block1+'R1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews1 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/
    $("#td_NEWS1").after(RightSUM)
    i=3;
    RightSUM=block1+'R2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews2 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/


     $("#pun-main").html('<table width=100% id="NEWS2"><tr valign=top>'+LeftSUM+'<td>'+$("#pun-main").html()+'</td>'+RightSUM+'</tr></table>'); 
     $("#NEWS1").prependTo("#pun-main")
}
    </script>

Отредактировано Deff (Вс, 24 Июл 2011 03:59:05)

0

29

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47
slide написал(а):

Подождите сек!

Может попробовать ширину ВСЕГО оставить 100%, но сделать отступы всех таблиц слева и справа от краёв примерно на пол сантиметра? Тогда границы таблиц не будут прилипать к краям экрана.

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

slide :glasses: Чот я спекси на сегодня - дафай завтра продолжим ?

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

Давай.  :hobo:  Спасибо тебе! Я есчо помучаю его...

Зато вот этому соответствует (особенно выделенному красным)...  :hobo: Если уж совсем точным быть, то и Ваш скрин не соответствует первому заказу. =)) Изначальный вариант кода, который Вы предложили, вобщем-то, это нормально. Что напрягло, так это то, что по вертикали таблицы были вразлёт... И зря я стал настаивать на своём варианте, всё-токи. =))

Может, действительно, забьём на седни, а?

Отредактировано slide (Вс, 24 Июл 2011 04:06:51)

0

30

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28
slide написал(а):

slide написал(а):Подождите сек!
            Может попробовать ширину ВСЕГО оставить 100%, но сделать отступы всех таблиц

:glasses: Тады так:

Код:
<style id=slide>
#pun {
width : 99%;
padding-left:0.5%;
padding-right:0.5%;
}
#pun-announcement h2{
display:none;
}
#News_L11,
#News_R11 {
height:182px;
}
#News_L22,
#News_R22 {
height:295px;
}
#NEWS1,
#NEWS2 {
vertical-align:top;
width:100%;
padding:0;
}
#NEWS1 td,
#NEWS2 td{
padding:3px;
}
</style>
<script>if($(".punbb").attr("id")!="pun-index")$("style.#slide").replaceWith("")</script>
     <div id=Inf_block_Left style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <div id=Inf_block_Right style="display:none">
    <h2>НОВОСТЬ 1</h2>
    Текст НОВОСТИ
    <h2>НОВОСТЬ 2</h2>
    Текст НОВОСТИ
    </div>

    <script type="text/javascript">
if($(".punbb").attr("id")=="pun-index"){
    var str='<table id="NEWS1" cellspacing="0" cellpadding="0"><tbody><tr valign="top"><td id="td_NEWS1"></td></tr></tbody></table>';
    $("#pun-announcement").before(str);//alert($("#NEWS1").html())

divArray = new Array (
   "pun-announcement",
   "pun-status",
   "pun-break1",
   "pun-crumbs1",
   "pun-break2",
"End"
);//alert("A")

 var N=divArray.length-2;
  for(var i=0; i<=N+1; i++ ){
  // alert((N-i)+">>#"+divArray[N-i]);
   $("#"+divArray[N+1-i]).prependTo("#td_NEWS1")
  }
    var L=$("#Inf_block_Left").html();$("#Inf_block_Left").replaceWith("");
    var R=$("#Inf_block_Right").html();$("#Inf_block_Right").replaceWith("");


      var LeftSUM='', RightSUM='',block1='<div class="container" style="padding:1px;" id=News_';
      var block2="</div>";
    var c = L.split(/<h2>|<\/h2>/igm);//alert(c)
    
    i=1
    LeftSUM=block1+'L1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews1 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/

    $("#td_NEWS1").before(LeftSUM)
    i=3
    LeftSUM=block1+'L2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    LeftSUM='<td id=LeftNews2 width=15% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/


    var c = R.split(/<h2>|<\/h2>/igm);
    i=1;
    RightSUM=block1+'R1'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews1 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/
    $("#td_NEWS1").after(RightSUM)
    i=3;
    RightSUM=block1+'R2'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    RightSUM='<td id=RightNews2 width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/


     $("#pun-main").html('<table width=100% id="NEWS2"><tr valign=top>'+LeftSUM+'<td>'+$("#pun-main").html()+'</td>'+RightSUM+'</tr></table>'); 
     $("#NEWS1").prependTo("#pun-main")
}
    </script>

0

31

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

Ща попробую...

0

32

  • Автор: slide
  • Стремящийся
  • Зарегистрирован: Сб, 23 Июл 2011
  • Сообщений: 18
  • Уважение: 0
  • Позитив: 0
  • Последний визит:
    Вс, 24 Июл 2011 22:34:47

Тааак... Пошли "блох ловить" на пикселях...  :D
Всё! Харэ на сегодня... Пойдёмте-ка по люлям разойдёмся.  :yep:

0

33

  • Автор: Deff
  • Тутошний...
  • Deff
  • Зарегистрирован: Ср, 16 Июн 2010
  • Сообщений: 51194
  • Уважение: +15227
  • Позитив: +11642
  • Последний визит:
    Сегодня 15:32:28

Карочь:

Завтра сфотаешь текущую и ниже нарисуешь идеальный вариант в том жа масштабе

Отредактировано Deff (Вс, 24 Июл 2011 04:22:22)

0

Страница:   1 2

Вы здесь » Единый форум поддержки » Корзина » Перекраиваем начисто