ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

Загадочный Дом «Кузнечик»

Форумные игры, кино, позитивное отношение и душевное общение!
Есть в мире место, где душе тепло...
Заходи, мы будем тебе рады!

Подробнее

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

Дизайн «Warlords of Draenor»

Детализированный rpg-дизайн для MyBB форума гильдии «Warlords of Draenor»
Стоимость при покупке эксклюзивно: 6300р
В стоимость входит настройка и корректировка дизайна под ваш проект.

Подробнее

Светлый дизайн в фентези стиле с аниме-графикой

Макет для светлого дизайна в фентези стиле с аниме-графикой.
Стоимость: 2600р*
Дизайн продается эксклюзивно (в одни руки).

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайте
Стать модераторомОтзывы

Предложения
На форуме идут технические работы. Кое-что кое-где может отображаться криво. Мы скоро всё поправим. :)

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

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



Таблица.

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

1

1. Ссылка на форум:pelagonium.spybb.ru
2. Эскиз таблицы: http://cs416123.vk.me/v416123322/58de/MSHtQGMmvnA.jpg
http://cs416123.vk.me/v416123322/58e6/Lr9VLZJOyAM.jpg
3. Дополнительные предпочтения:Категории в таблицу-не нужны.
Нужны золотистые стрелочки, небольшого размера; обыкновенные слова, как на эскизе, "локация: 1: 2: 3:.."

0

2

Messallo Sollamarro
Принимаю, в течение часа сделаю.

0

3

Messallo Sollamarro
Извиняюсь за столь долгий час ;)

HTML-верх
Код:
<style type="text/css">
#slideshow {
 margin:0 auto;
 width:500px;
 height:226px;
 position:relative;
}

#slideshow #slidesContainer {
  margin:0 auto;
  overflow:auto; /* поддержка прокрутки */
  position:relative;
}

#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:720px; /* На двадцать пикселев меньше чем ширина #slidesContainer */
  height:220px;
}

.control {
  display:block;
  width:48px; /* ширина стрелок */
  height:48px; /* высота стрелок */
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}

#leftControl {
top: 63px;
left: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/first-page.png) no-repeat 0 0;
}

#rightControl {
top: 68px;
right: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/finish.png) no-repeat 0 0;
}

</style>
HTML-низ
Код:
<script type="text/javascript">
$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 500;
  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>

$(document).ready(function() {


	$(".tab_content").hide(); 
	$("ul.tabs li:first").addClass("active").show();
	$(".tab_content:first").show();
	
	$("ul.tabs li").click(function() {
    $("ul.tabs li").removeClass("active");
    $(this).addClass("active");
    $(".tab_content").hide();
    var activeTab = $(this).find("a").attr("href");
    $(activeTab).fadeIn();
    return false;
	});

});

</script>
Объявление
Код:
<center>
<div id="slideshow">
    <div id="slidesContainer">
<!-- Первый слайд -->
	  <div class="slide">
        <table border="1" cellpadding="1" cellspacing="1" style="width: 500px; height: 200px;">
    	<tbody>
        <tr>
        	<td style="text-align: center;">
            <b>События</b><p>текст текст текст текст текст текст текст текст текст </td>
        	<td style="text-align: center;">
            <b>Сюжет</b><p>текст текст текст текст текст текст текст текст текст </td>
        	<td style: "overflow-x: scroll;"  style="text-align: center;">
            <b>Время и погода</b><p>текст текст текст текст текст текст текст текст текст </td>
        </tr>
    	</tbody>
    </table>
      </div>
<!-- Второй слайд -->
	  <div class="slide">
        <table border="1" cellpadding="1" cellspacing="1" style="width: 500px; height: 200px;">
    	<tbody>
        <tr>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td rowspan="2"  style: "overflow-x: scroll;"  style="text-align: center;">
            <b>Реклама</b><p>текст текст текст текст текст текст текст текст текст<p>
            <b>Баннеры</b><p>текст текст текст текст текст текст текст текст текст<p>
            <b>Партнеры</b><p>текст текст текст текст текст текст текст текст текст<p></td>
        </tr>
        <tr>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        </tr>
    	</tbody>
    </table>
      </div>
   </div>
</div>
</center>
Стрелки

.control {
  display:block;
  width:48px; /* ширина стрелок */
  height:48px; /* высота стрелок */
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}

#leftControl {
top: 63px;
left: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/first-page.png) no-repeat 0 0;
}

#rightControl {
top: 68px;
right: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/finish.png) no-repeat 0 0;
}

Это - размеры. в блоках #left и #rightControl - позиция стрелок.
Это - адрес стрелки.
Собственно, могу подогнать под другие стрелки, если дадите их ;)

0

4

Спасибо, суперски!

0

5

ээ. а стрелочки куда совать?)

0

6

опа-на. на маленькая совсем.

0

7

Messallo Sollamarro написал(а):

ээ. а стрелочки куда совать?)

#leftControl {
top: 63px;
left: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/first-page.png) no-repeat 0 0;
}
#rightControl {
top: 68px;
right: -50px;
background: transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/finish.png) no-repeat 0 0;
}

Это - ссылки на стрелки.

Messallo Sollamarro написал(а):

опа-на. на маленькая совсем.

В ширину-высоту сколько нужно?)

0

8

ну, я точно не наю, но под ширину форума что бы подходила. и прокрутка не работает совсем.

0

9

Messallo Sollamarro
можно ссылку на форум? у меня открывает страницу сервиса.

0

10

Messallo Sollamarro
попробуйте так:

HTML-верх
Код:
<style type="text/css">
<!--
#slideshow {
margin: 0 auto;
width: 900px;
height: 250px;
background: transparent;
position: relative;
}
#slideshow #slidesContainer {
margin: 0 auto;
width: 900px; 
height: 250px;
position: relative;
}
#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:880px; /* На двадцать пикселей меньше чем ширина #slidesContainer */
  height:250px;
}
.control {
  display:block;
  width:44px; /* ширина стрелок */
  height:125px; /* высота стрелок */
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
 right:900px; /* отодвигаем стрелку влево, чем больше значение, тем левее стрелка */
  background:transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/first-page.png) no-repeat 0 0;
}
#rightControl {
  top:0;
  left:900px;  /* отодвигаем стрелку вправо, чем больше значение, тем правее стрелка */
  background:transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/finish.png) no-repeat 0 0;
}
.slide h2, .slide p {
  margin:5px;
}

.layer {
text-align: center;
overflow-y: scroll;
height: 100%;
width: 98%;
padding: 5px;
}
</style>
HTML-низ
Код:
<script type="text/javascript">
$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 900;
  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>
Объявление
Код:
<center><div id="slideshow">
    <div id="slidesContainer">
<div class="slide">
        <table border="1" cellpadding="1" cellspacing="1" style="width: 900px;height: 100%;">
    	<tbody>
        <tr>
        	<td style="text-align: center;">
            <b>События</b><p>текст текст текст текст текст текст текст текст текст </td>
        	<td style="text-align: center;">
            <div class="layer"> <b>Сюжет</b><p>текст текст текст текст текст текст текст текст текст </div> </td>
        	<td style="overflow-x: scroll; text-align: center;">
            <b>Время и погода</b><p>текст текст текст текст текст текст текст текст текст </td>
        </tr>
    	</tbody>
    </table>
</div>

<div class="slide">
       <table border="1" cellpadding="1" cellspacing="1" style="width: 900px; height: 100%;">
    	<tbody>
        <tr>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td rowspan="2"><div class="layer"> 
            <b>Реклама</b><p>текст текст текст текст текст текст текст текст текст<p>
            <b>Баннеры</b><p>текст текст текст текст текст текст текст текст текст<p>
            <b>Партнеры</b><p>текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст <p></div></td>
        </tr> 
        <tr>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        	<td style="text-align: center;">
            <b>Локация</b>
<p>1. <a href="профиль">НИК</a>
<p>2. <a href="профиль">НИК</a>
<p>3. <a href="профиль">НИК</a>
<p>4. <a href="профиль">НИК</a></td>
        </tr>
    	</tbody>
    </table>
</div>
    </div>
</center>

Стрелки менять здесь:

HTML-верх

.control {
  display:block;
  width:44px; /* ширина стрелок */
  height:125px; /* высота стрелок */
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
right:900px; /* отодвигаем стрелку влево, чем больше значение, тем левее стрелка */
  background:transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/first-page.png) no-repeat 0 0;
}
#rightControl {
  top:0;
  left:900px;  /* отодвигаем стрелку вправо, чем больше значение, тем правее стрелка */
  background:transparent url(http://www.iconsearch.ru/uploads/icons/humano2/48x48/finish.png) no-repeat 0 0;
}

Эти значения подписаны
Это - ссылка на картинку стрелки

0