Сделал небольшой скрипт Light&Dark (затемнение сайта) как и обещал на обычном javascript'e

Перед /head вставить:

<script>
//////////////////////////////////////////////////////////////////////////////////////////
// Название: light&dark                                                                    //
// Автор: KJIA6EP (UXEN)                                                                //
// Версия: 0.1 (test)                                                                    //
// Комментарий: специально для prowebber.ru & icon desinger: Liam McKay                    //
//////////////////////////////////////////////////////////////////////////////////////////

function u_light_and_dark(func){

var on_dark = '0.7' // можете установить свою степень темноты от 0.1 до 1
var off_dark = '0' // отключение темноты

var on_imgurl = "img/lightbulb.png" // Внимание укажите путь к картинкам!
var off_imgurl = "img/lightbulb_off.png" // Внимание укажите путь к картинкам!

// дальше в код лучше не лезть!
// иначе электрик Дядя Вася будет злой! ^^

var light = document.getElementById("ubody_layout_ld").style;
var uld = document.getElementById('ubutton_ld');

if (func == 'on'){
light.opacity = on_dark
uld.innerHTML = '<img id="uimgurl" onclick="u_light_and_dark(\'off\');" src="'+off_imgurl+'" />'
}

else if (func == 'off') {
light.opacity = off_dark
uld.innerHTML = '<img id="uimgurl" onclick="u_light_and_dark(\'on\');" src="'+on_imgurl+'" />'
}

else {
alert('Ошибка 404: функция неопознана!')
}

}    
</script>

в стиль вашего сайта вставить:

#ubody_layout_ld{
    z-index: 1;
    position: fixed;
    margin: -100px;
    width: 200%;
    height: 200%;
    background: #000000;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
    opacity: 0.0;
}
#ubutton_ld{
    z-index: 3;
    position: fixed;
    left: 2px;
    top: 2px;
}
.udiv_look{
    position: fixed;
    z-index: 2;
}

Желательно перед /body (разницы нет)

<div id="ubody_layout_ld"> </div>
<div id="ubutton_ld"> <img id="uimgurl" onclick="u_light_and_dark('on');" src="img/lightbulb.png" /> </div>

В нужное вам место:

<div class="udiv_look">здесь блок в котором будет видео и т.п</div>

Добавлено: 16 Августа 2013 08:31:09 Добавил: Андрей Ковальчук Нравится 0

Добавить