ЙажаСценарий / Говнокод #162 Ссылка на оригинал

0

  1. 1
<html> <head> <style type="text/css"> html, body { background-color:#000; font-family:Segoe UI, Tahoma, Arial, sans-serif; font-size:11px; color:#FFF; margin:0px; padding:0px; width:100%; height:100%; overflow:hidden; } a:link, a:visited, a:active { color:#CCC; text-decoration:underline; } a:hover { color:#F00; text-decoration:none; } #progressbar_block { width:100%; height:100%; padding-left:50%; padding-top:50%; overflow:hidden; } ul.progressbar { width:400px; height:50px; padding:0px; margin:0px; margin-left:-200px; margin-top:-25px; clear:both; list-style-type:none; } ul.progressbar li { padding:0px; margin:0px; float:left; } li.left { background-image:url(img/l_bg_n.png); background-repeat:no-repeat; width:20px; height:50px; } li.middle { background-image:url(img/m_bg_n.png); background-repeat:repeat-x; width:360px; height:50px; } li.right { background-image:url(img/r_bg_n.png); background-repeat:no-repeat; width:20px; height:50px; } </style> <script language="javascript"> function func() { var max = 400 - 16; var pixels = 400 - 16; var step = pixels/max; next(0); } function next(i) { var max = 400 - 16; var pixels = 400 - 16; var step = pixels/max; var lft = document.getElementById("left_pb"); var mid = document.getElementById("middle_pb"); var rht = document.getElementById("right_pb"); if(i < 12) lft.style.width = String(8 + i) + "px"; else lft.style.width = String(20) + "px"; if(i < pixels - 12 && i > 12) mid.style.width = String(i - 12) + "px"; else if(i > 12) mid.style.width = String(360) + "px"; else mid.style.width = String(0) + "px"; if(i > 372) rht.style.width = String(i - 372) + "px"; else if(i < 372) rht.style.width = String(0) + "px"; setTimeout("next(" + (i + step < pixels ? i + step : 0) + ")", 25); } </script> </head> <body onload="func();"> <div id="progressbar_block"> <ul class="progressbar"> <li class="left"><div id="left_pb" style="background-image:url(img/l_bg_a.png); width:8px; height:50px; overflow:hidden;"> </div></li> <li class="middle"><div id="middle_pb" style="background-image:url(img/m_bg_a.png); width:0px; height:50px; overflow:hidden;"> </div></li> <li class="right"><div id="right_pb" style="background-image:url(img/r_bg_a.png); width:0px; height:50px; overflow:hidden;"> </div></li> </ul> </div> </body> </html>

Вот так мы делаем прогресс-бары

Запостил: guest guest, (Updated )

Комментарии (2) RSS

  • AsketMan:
    В одну строчку =(
    Может администрация добавит функциональность форматирования кода по стандартам? =)
    Ответить
  • armicron:
    в оригинале, он тоже в одну строчку
    Ответить

Добавить комментарий

Семь раз отмерь — один отрежь, guest!

    А не использовать ли нам bbcode?


    8