Как мне сделать так?
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Как мне создать такой блок? http://s005.radikal.ru/i212/1001/16/ee67c628197d.jpg
Slimmi
говорун
Группа: Модераторы
Пользователь №: 5
Сообщений: 287
Получено оценок: 38
MEDION , те нужно просто этот блок сделать? или он как-то анимирован?Большие фотостатусы
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Slimmi , он не анимирован, мне просто блок надо сделать, объяснить как сделать то что внутри него и как сделать так чтобы блок сворачивался/разворачивался..
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
хочу сделать блок как на сайте kiwi.kz
UnderShot
Группа: Модераторы
Пользователь №: 45
Сообщений: 923
Получено оценок: 85
MEDION , CTRL+U = у тебя все получитсяОчень важная тема! Filmzona — онлайн фильмы .
neio
говорун
Группа: Проверенные
Пользователь №: 128
Сообщений: 195
Получено оценок: 26
UnderShot , ctrl+c и ctrl+v тоже необходимо
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
UnderShot , я смотрел исходный код, скопировал, но ничего не получается(
UnderShot
Группа: Модераторы
Пользователь №: 45
Сообщений: 923
Получено оценок: 85
MEDION , что тебя именно интересует? Сверстать блок? Или скрипт сворачивания блока?Очень важная тема! Filmzona — онлайн фильмы .
SinuS
говорун
Группа: Модераторы
Пользователь №: 179
Сообщений: 195
Получено оценок: 15
UnderShot , наверное, он скрипт не скопипастил. P.S. Вообще нужно поговорить с Алеко по поводу рипов, чтобы запретить их. По сути нас просят рипнуть эту менюху.Talk is cheap.
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
Quote (SinuS )
P.S. Вообще нужно поговорить с Алеко по поводу рипов, чтобы запретить их. По сути нас просят рипнуть эту менюху.
П олный П издеЦ . Зачем рипать? Зачем?!! Тут сразу видно что из себя представляет русский Web-дев. Рип, рип, рип и сразу R.I.P. Никто даже не упомянул что такое меню можно сделать самому. Что скрипт валяется на каждом углу интернета. В общем тут говорить нечего. Прошу прощения за грубость...
Quote (MEDION )
Как мне создать такой блок?
Головой с помощью рук. Для начала нужно выучить HTML, CSS и JS. Или хотя бы немного в них разбираться и знать адрес google'a. Что бы что либо выучить нужно учится, учится можно с помощью книг, статей. За книгами идем либо в книжный магазин либо в интернет. Как и что думаю объяснять не нужно.
Дам подсказку. Делается такой блок с из списка или дивов, как на kiwi.kz.
——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
UnderShot
Группа: Модераторы
Пользователь №: 45
Сообщений: 923
Получено оценок: 85
Скрыть блок можно с помощью JQ: htmlCode
<div id='block'><a href='#' class='hide'>Скрыть блок</a></div>
jQueryCode
$('a.hide').click(function(){$('#block').hide('slow');});
Очень важная тема! Filmzona — онлайн фильмы .
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
мне нужно такой блок не дивами, а таблицей сделать
MadeMan
говорун
Группа: Проверенные
Пользователь №: 25
Сообщений: 185
Получено оценок: 6
MEDION , Ну, и в чем проблема?
Code
<table align="center" cellspacing="0" cellpadding="0" border="0"> <tr> <td class='hide'><a href='#'>Скрыть блок</a></td> </tr> </table>
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
MadeMan , мне нужно сделать блок как на сайте kiwi.kz, но тока чтобы он был не дивами, а таблицей...
SinuS
говорун
Группа: Модераторы
Пользователь №: 179
Сообщений: 195
Получено оценок: 15
Quote (BeSinLi )
Дам подсказку. Делается такой блок из
списка или дивов, как на kiwi.kz.
Это для кого человек писал?Talk is cheap.
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
Quote (SinuS )
Это для кого человек писал?
Вы о чем? Поконкретнее. MEDION , вот списком, так лучше как мне кажется. Хотя я не знаю зачем таблицами... Вот пример кода — w3fornoobs.my1.ru/examples/block
И сам код:
Code
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Как мне создать такой блок?</title> <style> .block { margin: 84px auto; width: 400px; } #h {text-align: center; padding: 5px 0 20px 0; font-size: 14px; } #list, .item { list-style-type: none; padding: 0; margin: 0; } .item { padding: 8px 20px 7px 20px; } .block ul li span { float: right; margin-left: 14px; } .option1, .option1 a { font: 10px; } .option2 { font: 10px; } </style> </head> <body> <div class="block"> <div id="h">Lorem ipsum dolor sit amet</div> <ul id="list"> <li class="item"> sollicitudin <span class="option1">ridiculus </span> <span class="option2">+444</span></li> <li class="item"> laoreet <span class="option1">ridiculus </span> <span class="option2">+444</span></li> <li class="item">malesuada <span class="option1">Donec </span> <span class="option2">+444</span></li> <li class="item">Suspendisse <span class="option1">Donec </span> <span class="option2">+444</span></li> <li class="item">laoreet <span class="option1">ridiculus </span> <span class="option2">+444</span></li> <li class="item">dapibus <span class="option1">vehicula</span> <span class="option2">+444</span></li> <li class="item">Suspendisse <span class="option1">Nullam </span> <span class="option2"> +444</span></li> <li class="item">laoreet <span class="option1">Donec </span> <span class="option2">+444</span></li> <li class="item">ltreet <span class="option1">purus</span> <span class="option2">+444</span></li> <li class="item">Suspendisse <span class="option1">vehicula</span> <span class="option2">+444.</span></li> <li class="item">malesuada <span class="option1">Nullam </span> <span class="option2">+444</span></li> <li class="item">dapibus<span class="option1">purus</span> <span class="option2">+444</span></li> <li class="item">hendrerit<span class="option1">vehicula</span> <span class="option2">+444</span></li> </ul> </div> </body> </html>
Цвета, шрифты, ширину добавлять по вкусу.
——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
Aleko
Watching you
Группа: Администраторы
Пользователь №: 2
Сообщений: 1621
Получено оценок: 167
Quote (BeSinLi )
...добавлять по вкусу.
Перемешать но не взбалтывать.. Простите, не удержался.
Бесплатные обои.
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
Quote (Aleko )
Перемешать но не взбалтывать..
Точку забыл. Третью.——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
BeSinLi , я же написал, что блок нужен не дивами, а таблицей..
Nigelist
Группа: Проверенные
Пользователь №: 192
Сообщений: 141
Получено оценок: 17
MEDION , а здесь вам что не таблица? И все таки если вы еще не отличаете дивы от таблицы изучать мат.часть. Бороться и искать, найти и перепрятать...
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
По моему это тролль и ему нужен бан . ——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Nigelist , этот блок свёрстан таблицей, но он не похож на блок как на kiw.kz, сам попытался сделать, но к сожелению не смог BeSinLi , я не троль)
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
MEDION , зачем именно таблицами?——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Quote (BeSinLi )
MEDION, зачем именно таблицами?
я прописал блок дивами, но в ИЕ дизайн скривился..вот из-за этого надо прописать таблицей
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
Quote (MEDION )
я прописал блок дивами, но в ИЕ дизайн скривился..вот из-за этого надо прописать таблицей
Можно элементарно поправить блок через CSS хак.——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
Nigelist
Группа: Проверенные
Пользователь №: 192
Сообщений: 141
Получено оценок: 17
MEDION , вам разве кто то обещал что будет делать вам блок похожий на блоки kiwi.kz? Вам дали направление куда рыть, вам только и осталось найти скрипт для плавного сворачивания блоков, и нарисовать пару треугольников. Остальное оформляется через CSS...Бороться и искать, найти и перепрятать...
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
Quote (Nigelist )
и нарисовать пару треугольников.
Их тоже можно через CSS. Или использовать стрелки — ↓ и ↑. MEDION , забыл сказать что мой вариант работает везде.
——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Quote (BeSinLi )
Можно элементарно поправить блок через CSS хак.
я не знаю как это можно сделать, вот и решил прописать таблицей..
neio
говорун
Группа: Проверенные
Пользователь №: 128
Сообщений: 195
Получено оценок: 26
http://studioad.ru/blog/css_haki_css_hacks_css_filters/2009-09-30-92 не судьба?
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Quote (neio )
http://studioad.ru/blog/css_haki_css_hacks_css_filters/2009-09-30-92 не судьба?
читал, но не разобрался:(
neio
говорун
Группа: Проверенные
Пользователь №: 128
Сообщений: 195
Получено оценок: 26
MEDION , пиши помогу чем смогу
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
neio , ты в асе когда бываешь?
Nigelist
Группа: Проверенные
Пользователь №: 192
Сообщений: 141
Получено оценок: 17
MEDION , ты лучше выкладывай что сделал. А мы всем миром поможем... Токо не надо копировать блоки с первой страницы... Бороться и искать, найти и перепрятать...
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
http://filmz.my1.ru/ - на этом сайте я дизайн прописал таблицей http://varis.ucoz.ru/ - тут использовал дивы, взятые у Алеко
подскажите как мне сделать так, чтобы дизайн с дивами был как дизайн с таблицей, у меня не получилось
Сообщение отредактировал MEDION - Среда, 27.01.2010, 14:08
Nigelist
Группа: Проверенные
Пользователь №: 192
Сообщений: 141
Получено оценок: 17
MEDION , во первых, чтобы значок сворачивания/разворачивания был справа используйте вложенный див в заголовке или две ячейки в таблице, а в нижних ячейках тогда параметр colspan. Во-вторых для для элементов списка используйте свойства CSS: Code
<style> селектор {display:block; padding:4px 2px; border-top:#CCC 1px solid; border-bottom:#CCC 1px solid} </style>
Бороться и искать, найти и перепрятать... Сообщение отредактировал Nigelist - Четверг, 28.01.2010, 11:55
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
Nigelist , а мог бы ты мне помочь, дизайн дивами прописать?
BeSinLi
спикер
Группа: Проверенные
Пользователь №: 216
Сообщений: 500
Получено оценок: 112
MEDION Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Персональный сайт - Главная страница</title> <style type="text/css"> body { font: 100% Verdana, Arial, Helvetica, sans-serif; background: #666666; margin: 0; padding: 0; text-align: center; color: #000000; } .twoColElsRtHdr #container { width: auto; background: #FFFFFF; margin: 0 40px; border: 1px solid #000000; text-align: left; } .twoColElsRtHdr #header { background: #DDDDDD; padding: 0 10px; } .twoColElsRtHdr #header h1 { margin: 0; padding: 10px 0; } .twoColElsRtHdr #sidebar1 { float: right; width: 12em; background: #EBEBEB; padding: 15px 0; } .twoColElsRtHdr #sidebar1 h3, .twoColElsRtHdr #sidebar1 p { margin-left: 10px; margin-right: 10px; } .twoColElsRtHdr #mainContent { margin: 0 13em 0 10px; } .twoColElsRtHdr #footer { padding: 0 10px; background:#DDDDDD; } .twoColElsRtHdr #footer p { margin: 0; padding: 10px 0; } .fltrt { float: right; margin-left: 8px; } .fltlft { float: left; margin-right: 8px; } .clearfloat { clear:both; height:0; font-size: 1px; line-height: 0px; } </style> <!--[if IE]> <style type="text/css"> .twoColElsRtHdr #sidebar1 { padding-top: 30px; } .twoColElsRtHdr #mainContent { zoom: 1; padding-top: 15px; } </style> <![endif]--> </head> <body class="twoColElsRtHdr"> <div id="container"> <div id="header"> </div> <div id="sidebar1"> </div> <div id="mainContent"> </div> <br class="clearfloat" /> <div id="footer"> </div> </div> </body> </html>
Ага. Код не мой а с дрима.
——————————-- „ Tempora mutantur, et nos mutamur in illis“ ——————————————— „ Si felix esse vis, este!“ ——————————————————————————————————————————————————————— старая аватарка
Nigelist
Группа: Проверенные
Пользователь №: 192
Сообщений: 141
Получено оценок: 17
BeSinLi , просвети по поводу этого момента. Для чего оно нужно? И где можно найти инфу какие параметры нужны для HTML 4.1? Quote (BeSinLi )
<html xmlns="http://www.w3.org/1999/xhtml">
__________________________________ Все разобрался, для HTML 4.1 это не нужно...Бороться и искать, найти и перепрятать... Сообщение отредактировал Nigelist - Пятница, 29.01.2010, 06:18
MEDION
Группа: Проверенные
Пользователь №: 81
Сообщений: 36
BeSinLi , разве этот код не похож на код Алеко?