Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Использование картинке как радиобатон (https://javascript.ru/forum/misc/22256-ispolzovanie-kartinke-kak-radiobaton.html)

IvanM 12.10.2011 17:02

Смена картинок
 
Здравствуйте, вопрос в следующем-имеется 5 картинок, расположенных вряд.Нужно на клик по второй(третьей...) картинке менять ее вид на картинку с белой точкой, а первую-с черной(переход по страницам новостей).
<div id="button">
		<div id="bt1"><img src="bt_wh.png"></div>
		<div id="bt2"><img src="bt_blc.png"></div>
		<div id="bt3"><img src="bt_blc.png"></div>
		<div id="bt4"><img src="bt_blk.png"></div>
		<div id="bt5"><img src="bt_blk.png"></div>
		<div id="All_news"><a href="">All news &rarr;</a></div>
    </div>

IvanM 13.10.2011 13:11

Простите, некорректно озаглавил тему. Впринцепе буду признателен просто за смену картинок(эффект переключения).

Serg_pnz 13.10.2011 14:04

Кто вообще понял вопрос?
м.б. это надо? http://cssglobe.com/lab/easyslider1.7/03.html

IvanM 13.10.2011 15:32

не совсем
пробовал так:
function chg(new_img) {

     document.getElementById('bt1').className = '';
      document.getElementById('bt2').className = '';
      document.getElementById('bt3').className = '';
      document.getElementById('bt4').className = '';
      document.getElementById('bt5').className = '';
      document.getElementById(new_img).className = 'active';       
}

<div id="button">
		<a href="javascript:chg('img1');" id="bt1" class="active"></a>
		<a href="javascript:chg('img2');" id="bt2"></a>
		<a href="javascript:chg('img3');" id="bt3"></a>
		<a href="javascript:chg('img4');" id="bt4"></a>
		<a href="javascript:chg('img5');" id="bt5"></a>
		<div id="All_news"><a href="">All news &rarr;</a></div>
    </div>

#bt1,#bt2,#bt3,#bt4,#bt5{
	background:url("bt_blk.png");
	float: left;
	width: 14px;
    height: 14px;
    margin-right: 20px;
    cursor: pointer;
}
#bt1.active,#bt2.active,#bt3.active,#bt4.active,#bt5.active{
	background:url("bt_wh.png");
	width: 14px;
    height: 14px;
}

для начала нужно хотябы сделать смену картинок
P.S. Я возможно запутал вас своим "смена картинок".Я имел ввиду не галерею, а именно кнопки.
Рабочий

IvanM 13.10.2011 16:00

РЕШЕНО

FINoM 14.10.2011 07:42

IvanM, возьмите за привычку описывать решение, а не просто писать "РЕШЕНО". Возможно, у кого-то будет подобный вопрос, а тут фигу.

IvanM 14.10.2011 13:05

Исправил код в своем посте. Просто ошибка детская даж стыдно что написал:D


Часовой пояс GMT +3, время: 06:01.