Написал индусский javascript, использующий jQuery и понял, что получил не то, что хотел.
Вкратце задача следующая: на странице товара цена представлена в трёх валютах: два дива блока со значениями цены скрыты, а один отображается. Причем изначально отображается базовая валюта, которую пользователь указал при размещении объявления (остальные два значения цены в альтернативных валютах вычисляются на сервере).
Для того, чтобы посетитель страницы имел возможность увидеть цену в приемлемой для него валюте, рядом с отображенной ценой предусмотрен всплывающий блок со краткими наименованиями валют (USD, EUR, BYR). При клике на значок валюты - высвечивается цена в данной валюте...
Вроде бы всё работает, несмотря на страшный код, но есть неудобный ньюанс: поскольку порядок блоков сейчас жёстко прописан в html шаблоне, во всплывающих блоках краткие наименования валют всегда расположены в одной и той же последовательности, что нелогично с точки зрения посетителя сайта: для него было бы удобнее, чтобы наименование валюты, в которой в данный момент отображается цена, выводился первым, а альтернативные — потом. Т.е. Человек видит цену в USD, рядом с ценой видит псевдо-ссылку "USD", при наведении мышки на которую ниже всплывают ссылки EUR и BYR. Если базовая цена определена в USD - проблема не выявляется, но если она к примеру, в EUR, первым всплывает всё равно блок USD.
Появилась мысль, что порядок вывода блоков с кратким наименованием валют должен меняться с помощью javascript. Т.е., если цена в белорусских рублях - первой в списке обозначений валют при наведении мышки на блок c кратким обозначением белорусского рубля должен быть блок с надписью BYR, а не USD, как сейчас.
Поскольку познания в javascript на данный момент стремятся к нулю, обращаюсь за помощью к более сведущим людям.
<div id="multiprice"><div id="price" style="float:left"><div class="usd_price" style="display:none">$ 69</div>
<div class="eur_price" style="display:none">€ 50</div>
<div class="byr_price">495000</div></div>
<div id="toggle_sheet" style="float:left; margin:6px;">
<div class="usd_toggle" style="display:none"><a href="#">USD</a></div>
<div class="eur_toggle" style="display:none"><a href="#">EUR</a></div>
<div class="byr_toggle"><a href="#">BYR</a></div></div></div>
var curr = "byr";
$("#toggle_sheet").hover(function() {
$(".usd_toggle").show();
$(".eur_toggle").show();
$(".byr_toggle").show();
},
function() {
$(".usd_toggle").click(function() {
$(".usd_price").show();
$(".eur_price").hide();
$(".byr_price").hide();
$(".eur_toggle").hide();
$(".byr_toggle").hide();
curr = "usd";
return false;
});
$(".eur_toggle").click(function() {
$(".eur_price").show();
$(".usd_price").hide();
$(".byr_price").hide();
$(".usd_toggle").hide();
$(".byr_toggle").hide();
curr = "eur";
return false;
});
$(".byr_toggle").click(function() {
$(".byr_price").show();
$(".usd_price").hide();
$(".eur_price").hide();
$(".usd_toggle").hide();
$(".eur_toggle").hide();
curr = "byr";
return false;
});
if (curr == "usd")
{
$(".eur_toggle").hide();
$(".byr_toggle").hide();
}
if (curr == "eur")
{
$(".usd_toggle").hide();
$(".byr_toggle").hide();
}
if (curr == "byr")
{
$(".eur_toggle").hide();
$(".usd_toggle").hide();
}
});
http://jsfiddle.net/zeppeline/znNkn/1/
