24.08.2017 РЕЗУЛЬТАТЫ КОНКУРСА
27.07.2017 ВНИМАНИЕ! WP ПРОВОДИТ КОНКУРС! Приглашены все!
02.08.2016 Встает вопрос об активных модераторов на 2-3 раздела.
11.05.2016 Напоминаем, что все тех.вопросы решает Северный Ветер. Набор персонала на должность модераторов/администраторов, ведение ротации и раздела "Пиар от Вайта" - это работа Дафны.
26.01.2016 Обновлена статистика ротации, почищены список ее участников.


13.12.2015 О задержках, альтернативных призах, режиме работы форума и пр. Читаем, внимаем

АГОНИЯ
[ заказать ]

БЕРНКАСТЕЛЬ
[ заказать ]

NAIAD
[ заказать ]

BLACKBERRY
[ заказать ]

White PR

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

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


Вы здесь » White PR » Скрипты » Создание таблицы.


Создание таблицы.

Сообщений 1 страница 23 из 23

1

Есть кровь из носу нужна таблица на форум, можно обратиться в это тему и попросить создать.
Обязательно для создания нужен шаблон таблицы (сделать можно в Paint или Photoshop) и ссылка на форум, если возникнут какие-то дополнительные вопросы.

0

2

Разобрались

вот к этому дизайну http://f3nky.rolka.su/
нужна таблица как на этой ролевой http://kirin.rolbb.ru/

не могу разобраться с кодами, обе ролки мои, так что авторские права не нарушаю)

0

3

Северный Ветер
можете помочь с таблицей? :3
если да - я сегодня скину шаблон)

0

4

К сожалению, я сейчас с телефона. Но кидайте шаблон - если будет простой, напишу так. Если "сложный" - придется ждать два-три дня, пока я приеду.

0

5

Северный Ветер
спасибо)
http://s1.uploads.ru/i/6fFud.png
вот,нарисовала, но не знаю, насколько доходчиво)
с левой стороной, думаю,понятно, а вот с правой..хочу,что бы информация скользила, то есть переключалась и можно было бы запихнуть туда побольше, что бы таблица не была слишком громадной)
кнопки навигации обычные, такого вида как на этом моем проекте, только подходящего цвета http://hp4.mybb.ru
ссылка того проекта,куда нужна таблица:
http://neworleans.rusff.ru/

буду очень благодарна :3

0

6

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

хтмл верх

Код:
<style>
#pun-stats h2 span,
.category h2 span {
visibility:hidden!important;
}
</style>

хтмл низ

Код:
<script type="text/javascript">
$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 196;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
  // С помощью скрипта убираем прокрутку в контейнере.
  $('#slidesContainer').css('overflow', 'hidden');
  // Свернем все вкладки .slides в блок #slideInner 
  slides .wrapAll('<div id="slideInner"></div>')
.css({
      'float' : 'left',
      'width' : slideWidth
    });
  // Проставим блоку #slideInner ширину, равную общей ширине контейнеров
  $('#slideInner').css('width', slideWidth * numberOfSlides);
  $('#slideshow')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');
  manageControls(currentPosition);
  $('.control')
    .bind('click', function(){
currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
    manageControls(currentPosition);
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });
  function manageControls(position){
    // Скрыть левую стрелку у первого контейнера
if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
// Скрыть правую стрелку у последнего контейнера
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }	
});
</script>

объявление:

<table  style="width: 100%;" cellpadding="3" cellspacing="0" border="0">
<tr align="center">
<td>Общая информация</td>
<td>Кнопки навигации</td>
</tr>
<tr align="center">
<td rowspan="2">
<!-- Cлайдер-->
<style type="text/css">
#slideshow {
margin:0 auto;
width:400px;
height:180px;
position:relative;}

#slideshow #slidesContainer {
  margin:0 auto;
  width:196px;
  height:180px;
  position:relative;}

#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:176px; /*ширина таблицы со слайдами */
  overflow-y:auto; /* поддержка прокрутки */
  height:180px; /*высота таблицы со слайдами */
  text-align: center;}

.control {
  display:block;
  width:102px;
  height:25px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
  z-index:100;}

#leftControl {
  top:87px;
  left:0;
  background:transparent url(картинка_с_левой_стрелкой) no-repeat 0 0;}

#rightControl {
  top:87px;
  right:0;
  background:transparent url(картинка_с_правой_стрелкой) no-repeat 0 0;}
</style>

<div id="slideshow">
<div id="slidesContainer">
<div class="slide">
Первый слайд со всякой инфой
</div>
<div class="slide">

Второй слайд

</div>
<div class="slide">

Третий слайд

</div>
</div>
</div><!--End// Cлайдер-->
</td>
</tr>
</table>

+1

7

Северный Ветер
спасибо большое,но вот в чем проблема - ссылки навигации и общая инфа вверху, а слайдеры - справа внизу оО
хотя вставила все туда,куда вы сказали)

0

8

.down here
Объявление измените:

Код:
<table  style="width: 100%;" cellpadding="3" cellspacing="0" border="0"> 
<tr align="center">
<td>Общая информация</td> 
<td>
<!-- Cлайдер-->
<style type="text/css">
#slideshow {
margin:0 auto;
width:400px;
height:180px;
position:relative;}

#slideshow #slidesContainer {
  margin:0 auto;
  width:196px;
  height:180px;
  position:relative;}

#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:176px; /*ширина таблицы со слайдами */
  overflow-y:auto; /* поддержка прокрутки */
  height:180px; /*высота таблицы со слайдами */
  text-align: center;}

.control {
  display:block;
  width:102px;
  height:25px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
  z-index:100;}

#leftControl {
  top:87px;
  left:0;
  background:transparent url(картинка_с_левой_стрелкой) no-repeat 0 0;}

#rightControl {
  top:87px;
  right:0;
  background:transparent url(картинка_с_правой_стрелкой) no-repeat 0 0;}
</style>

<div id="slideshow">
<div id="slidesContainer">
<div class="slide">
Первый слайд со всякой инфой
</div>
<div class="slide">

Второй слайд

</div>
<div class="slide">

Третий слайд

</div>
</div>
</div><!--End// Cлайдер-->
</td> 
</tr> 
<tr align="center">
<td rowspan="2">
Кнопки навигации
</td> 
</tr> 
</table>

+1

9

Северный Ветер
ооо,спасибо,теперь все хорошо))

0

10

Северный Ветер
здраствуйте. очень нужна таблица. вот ее шаблон:
http://savepic.su/2597791.png
думаю что все понятно должно быть) ролевой пока как такой не существует, но есть тестовик:
тестовик

0

11

Lifeless_Soul
Хорошо.

0

12

Код:
<table  style="width: 100%;" cellpadding="3" cellspacing="0" border="0">
<td>Администрация и модерация</td>
 <td>Тригада недели<br />
бла-бла-бла-бла-бла-бла....
<br />
Лицо форума<br />
бла-бла-бла-бла-бла...</td> 
<td>Приветствие для новичков.</td> 
</tr> 
<tr align="center">
<td rowspan="2"><div style="overflow: scroll; overflow-x: hidden; height: 500px;">События в игре</div></td> 
<td>монстрик, топы</td>
 <td>новости администрации</td>
</tr> 
<tr align="center">
<td><FORM>
<SELECT size=1 name='navigation'> 
  <OPTION value='ссылка' selected>Навигация</OPTION>
  <OPTION value='ссылка'>Навигация</OPTION>
  <OPTION value='ссылка'>Навигация</OPTION>
  <OPTION value='ссылка'>навигация</OPTION>
  <OPTION value='ссылка'>навигация</OPTION>
  <OPTION value='ссылка'>навигация</OPTION>
  <OPTION value='ссылка'>Навигация</OPTION>
  <OPTION value='ссылка'>навигация</OPTION>
</SELECT>
<INPUT class=but onclick="location.href = this.form.navigation.options[this.form.navigation.selectedIndex].value" type=button value="ВПЕРЁД!" name=button>
</FORM></td> 
<td>баннеры</td>
</tr>
</table>

+1

13

Северный Ветер
спасибо)

0

14

Dior
Это, хм, вне сомнения гениально. "Как там"!
А исходник картинки? А расположение кнопок? Определитесь, пожалуйста, девушка. Нарисуйте, где должна быть та или иная кнопка.

0

15

Спасибо, сама справилась :)

А можно мои кривые ручки под бульдозер? Я меняла текст и что-то похоже лишнее удалила, или написала, фиг его знает, но весь форум сдвинулся вправо...
http://testovyj.rolka.su/ - вот пациент, как его вылечить? Спасите меня пожалуйста :)

Отредактировано Мииреена (2 ноября, 2012г. 00:06:48)

0

16

http://s2.uploads.ru/t/b5PHD.png
Каждое из окошечек разворачивается (кроме "Объявления"), в них написаны имена;
Границы всех окошек прозрачные, поэтому нарисовал их серыми;
Вот пример (как бы хотелось, чтобы это выглядело): http://nimbamik.rusff.ru/
и хотелось бы, чтобы кнопочка "баннеры" была помещена в самый низ главной страницы.
Форум: http://academymanten.mybb.ru/

0

17

http://imgs.su/tmp/2012-11-16/1353045698-573.jpg
Пример такой таблицы: http://citadelofknowledge.rusff.ru/
самое главное чтобы под таблицу можно было поставить фоновую картинку.

0

18

Dior
Lisel'
Завтра выложу коды.

0

19

Lisel'

Ваша таблица

В html-верх.

<style>
#menu {
width: 170px;
margin-top: 0px;
margin-right: 0px;}

#menu span {
height: 50px;
font-size: 13px;
text-align: center;
display: block;
background: url(картинка_для_вкладок_если_нужна) top center no-repeat;
padding-top: 5px;}

#menu .tabactive {
color: #цвет_текста_активной_вкладки;}

#submenu {
margin-top: 57px;
margin-left: 52px;
text-align: center;
font-size: 12px;
width: 360px;}

.submenutext {
display: none;
height: 205px;}
</style>


В html-низ.

Код:
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").hide();
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).fadeIn();
    return false; });
});
</script>

Объявление

<center><table style="width: 875px; height: 415px; background: url(фон_для_общей_таблицы) top center no-repeat;" border="0" cellspacing="0" cellpadding="0">
  <tr  align=center>

   <td align="right">
    <div id="menu"> <b>
<span alt="#sm1" style="cursor: pointer;">Вкладка1</span>
<span alt="#sm2" style="cursor: pointer;">Вкладка2</span>
<span alt="#sm3" style="cursor: pointer;">Вкладка3</span>
<span alt="#sm4" style="cursor: pointer;">Вкладка4</span>
           </b>
    </div>
   </td>

   <td id="MenuTxT"  align="center" valign="top">
    <div id="submenu" align="center">
     <div id="sm1" class="submenutext" style="display:block;">

Текст контейнера №1

</div>
</div>
     <div id="sm2" class="submenutext">
Текст контейнера №2
</div>
     <div id="sm3" class="submenutext">
Текст контейнера №3

</div>
     <div id="sm4" class="submenutext">

Текст контейнера №4

</div>
   
</div>

   </td>
</tr>
</table></center>

Dior

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

кнопочка "баннеры" была помещена в самый низ главной страницы.

Страницы или таблицы?

Таблица без "баннеров"

Объявление.

<table style="width: 875px; height: 415px;" border="0" cellspacing="0" cellpadding="0">
  <tr  align=center>
<td colspan="2">
</td>
<div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Администрация</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Ваш текст</DIV></DIV>
</div>
</tr>
  <tr  align=center>
<td>
<div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Лучшие игроки</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Ваш текст</DIV></DIV>
</div>
</td>
<td>
<div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Модерация</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Ваш текст</DIV></DIV>
</div>
</td>
</tr>
  <tr  align=center>
<td colspan="2">
</td><div style="overflow: scroll; overflow-x: hidden; height: 300px;">Объявления</div>
</tr>
</table>


ХТМЛ-низ

Код:
<!--Спойлер - контейнер-->
<script type="text/javascript" src="http://ferodar.narod.ru/ajax/js/jquery.js"></script>
<script type="text/javascript"> 
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>

ХМТЛ-верх

<style>
div .splLink {width: 130px; height: 40px; background: #ссаасс; text-align: center; font-family: Comic Sans Ms; font-size: 15px; padding: 5px;}
.spll {width: 130px; height: 70px; }
.spll div .splCont {height: auto; width: 300px; background:  #eae8d2; padding: 5px; z-index: 1000; margin-top: 5px; border: 0px solid #eae8d2; font-size: 9px; font-family: verdana; text-align: center;}
</style>

0

20

Северный Ветер
Спасибо за таблицу. С баннерами уже рабобрался

0

21

Вот прям срочно нужна таблица. Очень прошу помочь.

http://s2.uploads.ru/k0mrv.png - общий вид таблицы
Ширина 800, высота 400. Без границ, прозрачная.
Вот все картиночки
http://s3.uploads.ru/bH5mM.png
http://s2.uploads.ru/oeMHn.png
http://s3.uploads.ru/CacUR.png
http://s2.uploads.ru/mLFSw.png

В части таблицы с marshals пять аватаров 75x75. 

На форум
http://mysteriousmystery.anihub.ru/

0

22

не требуется

Доброго времени суток, уже кучу времени убила на то, чтобы хоть как-то исправить косяк, но у меня совсем не выходит, поэтому прошу помощи у вас.

Скрин как выглядит таблица

http://s5.uploads.ru/mcRLX.png

Хотелось бы убрать вот это расстояние, которое в красной рамочке

Сам код таблицы:

Код:
<div id="pun-announcement" class="section">
<div class="container">
    <div class="html-box">
    <table  border="0" ><td align=center width=30%>
<img src="http://s4.uploads.ru/t/HIt0g.png">
<a href="http://misfits.rolfor.ru/profile.php?id=3" onMouseOver="imgOn('img2')"; onMouseOut="imgOff('img2')"><img src=" http://s4.uploads.ru/QalgV.jpg" name=img2></a>
<a href="http://misfits.rolfor.ru/profile.php?id=54" onMouseOver="imgOn('img2')"; onMouseOut="imgOff('img2')"><img src=" http://s4.uploads.ru/QalgV.jpg" name=img2></a>
<a href="http://misfits.rolfor.ru/profile.php?id=3" onMouseOver="imgOn('img2')"; onMouseOut="imgOff('img2')"><img src=" http://s4.uploads.ru/QalgV.jpg" name=img2></a>
<a href="http://misfits.rolfor.ru/profile.php?id=54" onMouseOver="imgOn('img2')"; onMouseOut="imgOff('img2')"><img src=" http://s4.uploads.ru/QalgV.jpg" name=img2></a>


<br>

<br><img src=" http://s4.uploads.ru/t/VanWh.png"></center>
<br>
ТОПЫ
<center><a href="http://top.roleplay.ru/18234" title="Рейтинг Ролевых Ресурсов - RPG TOP" target="top_">
<img src="http://img.rpgtop.su/88x31x11x8.gif" alt="Рейтинг Ролевых Ресурсов - RPG TOP" border="0" width="88" height="31"></a> <a href='http://wizardtop.ru/in.php?id=1680' target='_blank' title='Волшебный рейтинг игровых сайтов'><img src='http://wizardtop.ru/b/2.gif' border='0' width='88' height='31' alt='Волшебный рейтинг игровых сайтов'></a> 
<br><b>КЛИКАЕМ КАЖДЫЙ ДЕНЬ!</b></center>
</td>
<td   width="370px" >

<!-- Cлайдер-->
<style type="text/css">
#slideshow {
margin:0 auto;
width:400px;
height:180px;
position:relative;}

#slideshow #slidesContainer {
  margin:0 auto;
  width:196px;
  height:180px;
  position:relative;}

#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:176px; /* На двадцать пикселев меньше чем ширина #slidesContainer */
  overflow-y: no; /* поддержка прокрутки */
  height:180px;
  text-align: center;}

.control {
  display:block;
  width:102px;
  height:25px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
  z-index:100;}

#leftControl {
  top:87px;
  left:0;
  background:transparent url(http://s5.uploads.ru/t/cjJsl.png) no-repeat 0 0;}

#rightControl {
  top:87px;
  right:0;
  background:transparent url(http://s5.uploads.ru/t/pVMs1.png) no-repeat 0 0;}
</style>

<div id="slideshow">
<div id="slidesContainer">
<div class="slide">

<center><img src="http://s4.uploads.ru/t/mGxuy.png"></center><br/><br/>

<img src="http://s4.uploads.ru/QalgV.jpg"><img src="http://s4.uploads.ru/QalgV.jpg"><img src="http://s4.uploads.ru/QalgV.jpg"><img src="http://s4.uploads.ru/QalgV.jpg"><br>
<br/><br/><br/>

</div>
<div class="slide">

<img src="http://s4.uploads.ru/t/0ihjo.png">
<br>
<img src="http://s5.uploads.ru/kvOfo.jpg">
<br>

</div>
<div class="slide">
<img src="http://s5.uploads.ru/t/hDFyb.png">
<br>
<img src="http://s5.uploads.ru/kvOfo.jpg">
<br>
</div>
</div>
</div><!--End// Cлайдер-->


</td><td>
<center><img src="http://s4.uploads.ru/t/zOibM.png"></center>
<center><br><form>
<select name="select" class="forminput" onchange="location.href=(form.select.options[form.select.selectedIndex].value)">
<option>-- Navigation --</option>
  <option value="ссылка "><small>Гостевая</small></option>
<option value=" ссылка "><small> Правила</small></option>
<option value=" ссылка "><small>Сюжет</small></option>
<option value=" ссылка "><small>Внешности</small></option>
<option value=" ссылка "><small>Способности</small></option>
<option value=" ссылка на подфорум "><small> Акции </small></option>
</select>
<br></form>
</center>
<p align="justify"><font style=" font-family: arial; font-size: 11px; line-height: 7.5px; padding: -1px;">
<br>
<b>Дата и время: </b> 2012 год. 30 мая 10:00 – 15:00<br>
<b>Погода в Лондоне: </b>температура +25°C, тепло решило баловать нас, исключая любые осадки<br>
<b>Действия в игре: </b><br><center>Очередные общественные работы принесли Кертису, Келли и Руди множество сюрпризов. Одним из них стало внезапное появление Саймона и Алиши в общественном центре. Не понимая как это вообще могло произойти, они теряются в догадках, так как всего несколько дней назад Алиша была мертва а Саймон отправился в прошлое, что бы спасти ее. Так же они обнаруживают, что их старые способности вернулись, но какой ценой? Но после хорошего всегда приходит и плохое. Чуть позже, они узнают о смерти Нейтана, который был пойман за мошенничество в казино Лас-Вегаса.  </center><br></p>
</div>


<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
<center>...

</center>
</div>
</td></tr>

</table>

    </div>
</div>
</div>

Отредактировано Tanya (13 августа, 2013г. 13:19:53)

0

23

Не актуально

Добрый вечер. Можно ли попросить таблицу.

Графика. Таблица.

Эскиз таблицы

http://sh.uploads.ru/N4t10.jpg

Можно сделать такую же табличку на ролевой форум.
Ссылка на форум - http://aotlightwins.bestff.ru/

В данной таблице заменить навигацию на Баннеры с прокруткой вверх.
Баннеры топов опустить вниз где партнерство
А партнерство заменить на картинки модеров и поставить под администрацию.

Примерно как должно выглядеть

http://s7.uploads.ru/t/UhWNR.png

Отредактировано KAITO (29 сентября, 2015г. 22:13:02)

0


Вы здесь » White PR » Скрипты » Создание таблицы.