1. Ссылка на форум:
http://newmarvelwar.ru/
2. Эскиз таблицы:
таблица
3. Дополнительные предпочтения:
в середине таблицы встроен слайдер.
Таблица со встроенным слайдером.
Сообщений 1 страница 10 из 19
Поделиться111.02.13 16:12
- Бестелесный дух прошлого
- Уважение: +9
Поделиться212.02.13 13:44
- Бестелесный дух прошлого
- Уважение: +9
Прошу прощения.. Можете мне с заказом помочь?
Поделиться312.02.13 14:14
- Бестелесный дух прошлого
- Уважение: +798
Специалитсы не обитают на форуме, они выполнят ваш заказ, ожидайте.
Поделиться415.02.13 12:55
- Бестелесный дух прошлого
- Уважение: +9
Rush
я понимаю.. но до сих пор просто никто не отозвался... я уже и не надеюсь, что заказ сделают(
Поделиться515.02.13 13:17
- Бестелесный дух прошлого
- Уважение: +798
У нас просто крайне малоо осталось тех, кто делает заказы.
Поделиться615.02.13 14:21
- Бестелесный дух прошлого
- Уважение: +30
Trinity Wane
Сделаю Ваш заказ, только не волнуйтесь. Таблицы отнимают много времени, поэтому не все так быстро делается.
Поделиться715.02.13 14:24
- Бестелесный дух прошлого
- Уважение: +30
Кофеман написал(а):
Trinity Wane
Сделаю Ваш заказ, только не волнуйтесь. Таблицы отнимают много времени, поэтому не все так быстро делается.
Еще вдогонку, стиль и ширина форума будут те же, что и по ссылке форум в первом посте?
Поделиться815.02.13 17:07
- Бестелесный дух прошлого
- Уважение: +9
Кофеман
да такой же, в ближайшее время изменений не планируем, большое вам спасибо)
Поделиться915.02.13 17:16
- Бестелесный дух прошлого
- Уважение: +30
Trinity Wane написал(а):
Кофеман
да такой же, в ближайшее время изменений не планируем, большое вам спасибо)
хм.. самонения меня одолевают по поводу ширины. Слишком узкий у Вас форум для такой громоздкой таблицы как на эскизе. Ну да ладно, попробую, посмотрим что получится.
Поделиться1016.02.13 01:13
- Бестелесный дух прошлого
- Уважение: +30
Trinity Wane
Ваша таблица
В окно HTML верх
Код:
<!-- Стиль слайдера -->
<style type="text/css">
#slideshow {
margin:0 auto;
width:378px;
height:364px;
position:relative;
}
#slideshow #slidesContainer {
margin:0 auto;
width:356px;
height:364px;
overflow:auto; /* поддержка прокрутки */
position:relative;
}
#slideshow #slidesContainer .slide {
margin:0 auto;
width:336px; /* На двадцать пикселев меньше чем ширина #slidesContainer */
height:364px;
}
.control {
display:block;
width: 52px; /* ширина стрелок */
height:36px; /* высота стрелок */
text-indent:-10000px;
position:absolute;
cursor: pointer;
}
#leftControl {
top: -10px;
left:-20px; /* отодвигаем стрелку влево, чем больше значение, тем левее стрелка */
background: transparent url(http://s3.uploads.ru/nipbU.png) no-repeat 0 0;
}
#rightControl {
top: -10px;
right:-20px; /* отодвигаем стрелку вправо, чем больше значение, тем правее стрелка */
background: transparent url(http://s3.uploads.ru/5Gi2Z.png) no-repeat 0 0;
}
.slide h2, .slide p {
margin:15px;
}
</style>В окно HTML-низ
Код:
<script type="text/javascript">
$(document).ready(function(){
var currentPosition = 0;
var slideWidth = 356;
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 cellspacing="0" cellpadding="0" border="0" style="width: 740px; margin-left: -6px!important;">
<tr>
<td align="center" valign="top" style="width: 180px;">
<!-- Левый блок -->
<div align="center" style="margin: 4px;">Рейтинг</div>
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 176px; height: 100px; border: 1px solid;">
Текст рейтинга. Прокрутка появится автоматически.
</div>
<div align="center" style="margin: 4px;">Нужные</div>
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 176px; height: 276px; border: 1px solid; margin-bottom: 5px;">
Текст "Нужных". Прокрутка появится автоматически.
</div>
<!-- конец левого блока -->
</td>
<td align="center" valign="top" style="width: 380px;">
<!--- Блок слайдер и кнопок плеера --->
<div id="slideshow">
<div id="slidesContainer">
<!-- Первый слайд -->
<div class="slide">
<br><br><br>
<img src="адрес картинки" alt="картинка активисты" border="0"><br>
<img src="адрес картинки" alt="активист 1" border="0">
<img src="адрес картинки" alt="активист 2" border="0">
<img src="адрес картинки" alt="активист 3" border="0">
<img src="адрес картинки" alt="активист 4" border="0">
<br><br><br>
<img src="адрес картинки" alt="картинка флудеры" border="0"><br>
<img src="адрес картинки" alt="флудер 1" border="0">
<img src="адрес картинки" alt="флудер 2" border="0">
<img src="адрес картинки" alt="флудер 3" border="0">
<img src="адрес картинки" alt="флудер 4" border="0">
</div>
<!-- Второй слайд -->
<div class="slide">
<br><br><br>
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<img src="адрес картинки" alt="картинка 1" width="55" height="55" border="0">
<br><br><br>
<table cellspacing="2" cellpadding="2" border="0" style="width: 330px;">
<tr>
<td align="center" valign="top" style="width: 165px;">
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 160px; height: 220px; border: 1px solid;">
Игровая информация
</div>
</td>
<td align="center" valign="top" style="width: 165px;">
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 160px; height: 220px; border: 1px solid;">
Время погода
</div>
</td>
</tr>
</table>
</div>
<!-- Третий слайд -->
<div class="slide">
<br><br><br><br>
Лучший игрок<br><br>
<img src="адрес картинки" alt="Картинка игрока" border="0"><br><br>
Текст поста
</div>
</div>
</div>
<div align="center" style="height: 30px;">
Кнопки плеера вставлять тут
</div>
<!--- Конец блока слайдера --->
</td>
<td align="center" valign="top" style="width: 180px;">
<!-- Правый блок -->
<div align="center" style="margin: 4px;">Ссылки</div>
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 176px; height: 100px; border: 1px solid;">
<a href="адрес ссылки">Описание ссылки</a><br>
<a href="адрес ссылки">Описание ссылки</a><br>
<a href="адрес ссылки">Описание ссылки</a><br>
<a href="адрес ссылки">Описание ссылки</a><br>
<a href="адрес ссылки">Описание ссылки</a><br>
</div>
<div align="center" style="margin: 4px;">Должники</div>
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 176px; height: 150px; border: 1px solid;">
Должник локация много текста
</div>
<div align="center" style="margin: 4px;">Топы</div>
<div style="overflow-y: auto; overflow-x: hidden; padding: 1px; width: 176px; height: 100px; border: 1px solid; margin-bottom: 5px;">
3 топа
</div>
<!-- Конец правого блока -->
</td>
</tr>
<tr>
<td colspan="3" align="center" style="height: 60px;">баннеры</td>
</tr>
</table>
