я не знаю, возможно ли смастерить такую таблицу :з
1. Ссылка на форум: его пока нет, но будет по тематике котов-воителей.
2. Эскиз таблицы: 1 лист 2 лист 3 лист
3. Дополнительные предпочтения: рамки не видно, а отступ текста внутри ячеек от рамки был не меньше 15 пикселей. размер шрифта в таблице равен 10рх.
это стрелки: лево право
также хочу спросить, каким образом делается, что за ссылками появляется фон? пример:
в тех местах, где ничего не перелистывется хочу такую навигацию т_т если это делается еще в коде таблицы, то пожалуйста сделайте.
и у меня просьба показать мне, как менять фон таблицы и цвет того самого фона за ссылками, чтобы я могла менять его с изменением дизайна.
Горизонтальный слайдер
Страница: 1
Тема закрыта
Сообщений 1 страница 8 из 8
Поделиться101.02.13 16:34
- Бестелесный дух прошлого
- Уважение: +2
Поделиться204.02.13 11:30
- Бестелесный дух прошлого
- Уважение: +2
Прошу прощения за повторение, не могли бы вы принять заказ?
Поделиться307.02.13 09:38
- Бестелесный дух прошлого
- Уважение: +394
LAP
возьму.
хотелось бы уточнить цвет фона или картинку в фон таблицы и/или слайдера.
Поделиться407.02.13 21:23
- Бестелесный дух прошлого
- Уважение: +2
Jii-Jo написал(а):
LAP
возьму.
хотелось бы уточнить цвет фона или картинку в фон таблицы и/или слайдера.
спасибо .D
дело в том, что мне фон не нужен, так как дизайн еще не сделан. я просто хотела бы знать, где его можно поменять/вставить, чтобы уже самостоятельно изменять цвет фона таблицы при появлении новых дизайнов.
Поделиться511.02.13 06:34
- Бестелесный дух прошлого
- Уважение: +394
LAP
приношу огромные извинения, что пропала..
фон
#slideshow {
margin:0 auto;
width:300px;
height:400px;
background: url(фон) no-repeat 0 0;
background: #e6eaf6;
position:relative;
}
.....
#slideshow #slidesContainer .slide {
margin:0 auto;
width:280px; /* На двадцать пикселей меньше чем ширина #slidesContainer */
height:400px;
background: url(фон);
border-radius: 25px;
}
сам код
Код:<style type="text/css"> <!-- #slideshow { margin:0 auto; width:300px; height:400px; background: url(фон) no-repeat 0 0; background: #e6eaf6; position:relative; } #slideshow #slidesContainer { margin:0 auto; width:300px; height:400px; overflow:auto; /* поддержка прокрутки */ position:relative; } #slideshow #slidesContainer .slide { margin:0 auto; width:280px; /* На двадцать пикселей меньше чем ширина #slidesContainer */ height:400px; background: url(фон); border-radius: 25px; } .control { display:block; width:52px; /* ширина стрелок */ height:36px; /* высота стрелок */ text-indent:-10000px; position:absolute; cursor: pointer; } #leftControl { top: 110px; left: -45px; /* отодвигаем стрелку влево, чем больше значение, тем левее стрелка */ background:transparent url(http://s3.uploads.ru/nipbU.png) no-repeat 0 0; } #rightControl { top: 110px; left: 300px; /* отодвигаем стрелку вправо, чем больше значение, тем правее стрелка */ background:transparent url(http://s3.uploads.ru/5Gi2Z.png) no-repeat 0 0; } .slide h2, .slide p { margin:15px; } .slide img { float: center; margin:0 15px; } --> </style> <script type="text/javascript"> $(document).ready(function(){ var currentPosition = 0; var slideWidth = 280; 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 top><table width="900px" height="400px"> <tr> <td rowspan="2" width="300px" height="200px" font-size: 10px;> <p><b>Очередь постов</b><p> должников нет </td> <td><div id="slideshow"> <div id="slidesContainer"> <div class="slide"> <center>1 слайд </div> <div class="slide"> <center>2 слайд </div> <div class="slide"> <table> <tr> <td width="260px" height="150px"><center>1</td> <td width="260px" height="250px"><center>2</td> </tr> <tr> <td width=520px" height="40px"><center>баннеры баннеры баннеры баннеры баннеры баннеры баннеры баннеры баннеры баннеры </td> </tr> </table> </div> <td rowspan="3" width="300px" height="200px" font-size: 10px;> <p><b>Очередь постов</b><p> должников нет </td> </div> </center></td> </tr> </table></center>
Поделиться611.02.13 21:57
- Бестелесный дух прошлого
- Уважение: +2
Jii-Jo
благодарю :з
Поделиться712.02.13 08:30
- Бестелесный дух прошлого
- Уважение: +394
LAP
все отображается хорошо, да? тему закрывать?
Поделиться813.02.13 09:51
- Бестелесный дух прошлого
- Уважение: +2
Jii-Jo написал(а):
LAP
все отображается хорошо, да? тему закрывать?
все нормально, но вот только вы ширину и высоту перепутали) в табличке высота 300 а ширина ячеек разная)
Тема закрыта
Страница: 1
