psywalker
-
Posts
13,707 -
Joined
-
Last visited
-
Days Won
58
Content Type
Profiles
Forums
Calendar
Store
Everything posted by psywalker
-
Можно ли посавить метку <label> на изображение?
psywalker replied to M_A_X's question in HTML Coding
Не вопрос, а что ты скажешь на это? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Bg</title> <style type="text/css"> *{ margin: 0; padding:0} html, body { background: #999; height: 100%; } div { padding: 5px 5px 30px; background: #fff; width: 100px;} img { display: block; margin-top: 20px; border: 1px solid #000; padding: 3px;} </style> </head> <body> <div id="conteiner"> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <img src="img1.png" /> <img src="img2.png" /> <img src="img3.png" /> </div> <script> var div = document.getElementById('conteiner') var img = div.getElementsByTagName('img') var input = div.getElementsByTagName('input') for(var i = 0; i<img.length;i++)img.item(i).onclick=function(){test(this)} function test(node){ for(var i = 0; i<img.length;i++)img.item(i).input = input.item(i) for(var i = 0; i<input.length;i++)input.item(i).checked=false node.input.checked=true } </script> </body> </html> -
Да ерунда, побольше давай задачек, мне тока за радость же
-
Можно ли посавить метку <label> на изображение?
psywalker replied to M_A_X's question in HTML Coding
Опиши задачу по полочкам, я попробую сделать. Вот смотри с чекбоксами, чем плохо? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Bg</title> <style type="text/css"> *{ margin: 0; padding:0} html, body { background: #999; height: 100%; } div { padding: 5px 5px 30px; background: #fff; width: 100px;} img { display: block; margin-top: 20px; border: 1px solid #000; padding: 3px;} </style> </head> <body> <form id="form" action="#"> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> </form> <div id="divImg"> <img src="img1.png" onclick="test(this)" /> <img src="img2.png" onclick="test(this)" /> <img src="img3.png" onclick="test(this)" /> </div> </div> <script> var divImg = document.getElementById('divImg') var img = divImg.getElementsByTagName('img') var form = document.getElementById('form') var input = form.getElementsByTagName('input') img.item(0).input = input.item(0) img.item(1).input = input.item(1) img.item(2).input = input.item(2) function test(node){ for(var i = 0; i<input.length;i++) input.item(i).checked=false node.input.checked = true; } </script> </body> </html> -
Да, нужна ссылка, присоединяюсь.
-
Да не вопрос дружище, держи скорее. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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"> *{ margin: 0; padding: 0;} label { display: block;} fieldset{ margin: 20px 10px;} input { margin-right: 5px;} </style> </head><body> <form action="#" id="form"> <fieldset id="category"> <label><input type='checkbox' value='1' onclick="assortment(this);" >Продукты питания</label> <label><input type='checkbox' value='2' onclick="assortment(this);">Одежда</label> <label><input type='checkbox' value='3' onclick="assortment(this);">Бытовая техника</label> </fieldset> <fieldset id="byCategory"> <label><input type='checkbox' value='4' onclick="assortment(this);">Молоко</label> <label><input type='checkbox' value='5' onclick="assortment(this);">Кефир</label> <label><input type='checkbox' value='6' onclick="assortment(this);">Сахар</label> <label><input type='checkbox' value='7' onclick="assortment(this);">Куртка</label> <label><input type='checkbox' value='8' onclick="assortment(this);">Шапка</label> <label><input type='checkbox' value='9' onclick="assortment(this);">Штаны</label> <label><input type='checkbox' value='10' onclick="assortment(this);" >Телевизор</label> <label><input type='checkbox' value='11' onclick="assortment(this);">Магнитофон</label> <label><input type='checkbox' value='12' onclick="assortment(this);">Плита</label> </fieldset> </form> <script type="text/javascript"> function assortment(node){ var check = node.value var category = document.getElementById('category') var inputCategory = category.getElementsByTagName('input') var byCategory = document.getElementById('byCategory') var inputByCategory = byCategory.getElementsByTagName('input') var product = [[4,5,6],[7,8,9],[10,11,12]] if(node.checked){ if(check == 1){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[0][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[0][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[0][2]){ inputByCategory.item(k).disabled="" } } } if(check == 2){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[1][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[1][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[1][2]){ inputByCategory.item(k).disabled="" } } } if(check == 3){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[2][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[2][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[2][2]){ inputByCategory.item(k).disabled="" } } } }else{ if(check == 1){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[0][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[0][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[0][2]){ inputByCategory.item(k).disabled="disabled" } for(var i = 0; i<inputByCategory.length; i++)inputByCategory.item(i).checked=false } } if(check == 2){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[1][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[1][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[1][2]){ inputByCategory.item(k).disabled="disabled" } for(var i = 0; i<inputByCategory.length; i++)inputByCategory.item(i).checked=false } } if(check == 3){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[2][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[2][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[2][2]){ inputByCategory.item(k).disabled="disabled" } for(var i = 0; i<inputByCategory.length; i++)inputByCategory.item(i).checked=false } } } } </script> </body></html>
-
Есть спец.теги для этого. А ещё можешь залить к себе на хост, а нам ссылку.
-
overflow:hidden; повесь на UL
-
Неужели ТС задал такой лёгкий вопрос? Я поэтому и переспросил. Подождём ответа.
-
1) Адрес этот, я не ошибся? http://ru.srichinmoycentre.org/ 2) Что именно за полоска, покажи на скрине
-
#text{ min-width:500px; margin-left: 255px;
-
overflow: hidden; родителю
-
Попробуй задать размер шрифта проблемным местам, какой нить маленький, или вообще начни с нуля и т.д. и ещё повесь zoom:1;
-
ТС, заголовки тем делай понятнее в след.раз.
-
Можно ли посавить метку <label> на изображение?
psywalker replied to M_A_X's question in HTML Coding
Да не за что, мы ещё будет его обдумывать, нужно усовершенствовать. -
Можно ли посавить метку <label> на изображение?
psywalker replied to M_A_X's question in HTML Coding
Медведь, а объясни плиз задачу, покажи решение твоё, т.е. всё на ЦСС решается? Это же тока на JS реал сотворить? Я себе это так примерно представлял <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>radio images</title> <style type="text/css"> *{ margin: 0; padding: 0;} label { display: block;} input { margin-right: 5px;} </style> </head><body> <img src="img1.png" id="one" onclick="img(this);" /> <img src="img2.png" id="two" onclick="img(this);"/> <img src="img3.gif" id="three" onclick="img(this);"/> <form action="#" id="form"> <label><input type='radio' value='1'>Картинка 1</label> <label><input type='radio' value='2'>Картинка 2</label> <label><input type='radio' value='3'>Картинка 3</label> </form> <script type="text/javascript"> function img(node){ var form = document.getElementById('form') var formInput = form.getElementsByTagName('input') for(var i = 0; i<formInput.length;i++)formInput.item(i).checked=false if(node.getAttribute('id')=='one')formInput.item(0).checked=true if(node.getAttribute('id')=='two')formInput.item(1).checked=true if(node.getAttribute('id')=='three')formInput.item(2).checked=true } </script> </body></html> -
Можно ли посавить метку <label> на изображение?
psywalker replied to M_A_X's question in HTML Coding
Я не понял задачу, т.е. у тебя есть форма с инпутами radio, каждый из них отвечает за определённое изображение, картинку? И ты хочешь, чтобы при клике на картинку врубался определённый инпут? Или наоборот? -
Вердер, ты же слово мужское дал, что больше тут не появишься, столько произнёс фраз с подобными темами и т. д. Как же так, получается ты вообще слово не держишь?
-
горизонтальный список с графическими разделителями
psywalker replied to Kotyara's question in HTML Coding
Молодца, приходи ещё. -
горизонтальный список с графическими разделителями
psywalker replied to Kotyara's question in HTML Coding
А ты повесь на первый ЛИ <li class='first'> и отмени у него фон просто. А вообще трабл сам в том, что у тя там паддинг фонит у .submenu2 ul , обнули его, настрой отступы и всё. -
горизонтальный список с графическими разделителями
psywalker replied to Kotyara's question in HTML Coding
Покажи весь код, который щас есть. -
Так пойдёт? <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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"> *{ margin: 0; padding: 0;} label { display: block;} fieldset{ margin: 20px 10px;} input { margin-right: 5px;} </style> </head><body> <form action="#" id="form"> <fieldset id="category"> <label><input type='checkbox' value='1' onclick="assortment(this);" >Продукты питания</label> <label><input type='checkbox' value='2' onclick="assortment(this);">Одежда</label> <label><input type='checkbox' value='3' onclick="assortment(this);">Бытовая техника</label> </fieldset> <fieldset id="byCategory"> <label><input type='checkbox' value='4' onclick="assortment(this);">Молоко</label> <label><input type='checkbox' value='5' onclick="assortment(this);">Кефир</label> <label><input type='checkbox' value='6' onclick="assortment(this);">Сахар</label> <label><input type='checkbox' value='7' onclick="assortment(this);">Куртка</label> <label><input type='checkbox' value='8' onclick="assortment(this);">Шапка</label> <label><input type='checkbox' value='9' onclick="assortment(this);">Штаны</label> <label><input type='checkbox' value='10' onclick="assortment(this);" >Телевизор</label> <label><input type='checkbox' value='11' onclick="assortment(this);">Магнитофон</label> <label><input type='checkbox' value='12' onclick="assortment(this);">Плита</label> </fieldset> </form> <script type="text/javascript"> function assortment(node){ var check = node.value var category = document.getElementById('category') var inputCategory = category.getElementsByTagName('input') var byCategory = document.getElementById('byCategory') var inputByCategory = byCategory.getElementsByTagName('input') var product = [[4,5,6],[7,8,9],[10,11,12]] if(node.checked){ if(check == 1){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[0][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[0][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[0][2]){ inputByCategory.item(k).disabled="" } } } if(check == 2){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[1][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[1][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[1][2]){ inputByCategory.item(k).disabled="" } } } if(check == 3){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[2][0]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[2][1]){ inputByCategory.item(k).disabled="" } if(inputByCategory.item(k).value==product[2][2]){ inputByCategory.item(k).disabled="" } } } }else{ if(check == 1){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[0][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[0][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[0][2]){ inputByCategory.item(k).disabled="disabled" } } } if(check == 2){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[1][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[1][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[1][2]){ inputByCategory.item(k).disabled="disabled" } } } if(check == 3){ for(var k = 0; k<inputByCategory.length; k++){ if(inputByCategory.item(k).value==product[2][0]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[2][1]){ inputByCategory.item(k).disabled="disabled" } if(inputByCategory.item(k).value==product[2][2]){ inputByCategory.item(k).disabled="disabled" } } } } } </script> </body></html>
-
горизонтальный список с графическими разделителями
psywalker replied to Kotyara's question in HTML Coding
А ты сдвинь ЛИ немного назад, отрицательным марджином. -
ТС, при таких требованиях и зарплате есть лишь одно условие, если ваш веб-мастер будет знать всё на начальном уровне, только азы. Вот тогда ваша зарплата при таких раскладах оправдывается. А так, извольте, это наглость, тем-более для Москвы.
-
горизонтальный список с графическими разделителями
psywalker replied to Kotyara's question in HTML Coding
Вот и я про тоже, с оверфлоу перебор, да и не только, с position:relative; также. -
ТС на будущее. Заголовки у постов делай понятные.