» » Balsavimo dizainas

Balsavimo dizainas

Balsavimo dizainas


Datalife Engine balsavimo dizainas. Lengvai galite modifikuoti CSS kodą. Pritaikytas DLE 9.x - 10.x
1. Atsidarome failą engine/modules/vote.php ir surandame:
$entry .= "
$body[$i] - $num ($proc%)
{$proc}%
\n";

Pakeičiame į:
$entry .= "
$body[$i] - $num kart.
{$proc}%
\n";

2. Atidarome failą engine/ajax/vote.php ir surandame:
$entry .= "<div class=\"vote\">$body[$i] - $num ($proc%)</div><div class=\"voteprogress\"><span class=\"vote{$pn}\" style=\"width:".intval($proc)."%;\">{$proc}%</span></div>\n";


Pakeičiame į:
$entry .= "<div class=\"vote\">$body[$i] - $num kart.</div><div class=\"shinee voteprogress\"><span class=\"vote{$pn}\" style=\"width:" . intval($proc) . "%;\"><div style=\"margin-top:2.4px\">{$proc}%</div></span></div>\n";


3. Atidarome failą engine/ajax/allvotes.php ir surandame:
$entry .= "<tr><td width=\"20\" nowrap>{$radio}</td><td><div class=\"vote\">$body[$i] - $num ($proc%)</div><div class=\"voteprogress\"><span class=\"vote{$pn}\" style=\"width:".intval($proc)."%;\">{$proc}%</span></div></td></tr>";


Pakeičiame:
$entry .= "<tr><td width=\"20\" nowrap>{$radio}</td><td><div class=\"vote\">$body[$i] - $num kart.</div><div class=\"shinee voteprogress\"><span class=\"vote{$pn}\" style=\"width:" . intval($proc) . "%;\"><div style=\"margin-top:2.4px\">{$proc}%</div></span></div></td></tr>";


4. Atsidarome savo dizaino CSS failą (engine.css ar style.css) ir susirandame .voteprogress ištriname visas klases

Pačioje pabaigoje įstatome:
/* вывод результатов голосования на сайте */
.voteprogress{overflow:hidden;height:20px;margin-bottom:5px;background-color:#f7f7f7;background-image:-moz-linear-gradient(top,#f5f5f5,#f9f9f9);background-image:-ms-linear-gradient(top,#f5f5f5,#f9f9f9);background-image:-webkit-gradient(linear,0 0,0 100%,from(#f5f5f5),to(#f9f9f9));background-image:-webkit-linear-gradient(top,#f5f5f5,#f9f9f9);background-image:-o-linear-gradient(top,#f5f5f5,#f9f9f9);background-image:linear-gradient(top,#f5f5f5,#f9f9f9);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5',endColorstr='#f9f9f9',GradientType=0);-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}
.voteprogress span{color:#4D4D4D;text-align:center;height:20px;display:block;overflow:hidden;background-color:#C2A8F0;background-image:-webkit-gradient(linear,left top,left bottom,from(#C2A8F0),to(#B04FE8));background-image:-webkit-linear-gradient(top,#C2A8F0,#B04FE8);background-image:-moz-linear-gradient(top,#C2A8F0,#B04FE8);background-image:-ms-linear-gradient(top,#C2A8F0,#B04FE8);background-image:-o-linear-gradient(top,#C2A8F0,#B04FE8);background-image:linear-gradient(top,#C2A8F0,#B04FE8);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#149bdf',endColorstr='#0480be',GradientType=0);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}
.voteprogress .vote2 {background-color: #fecf23;background-image: -webkit-gradient(linear, left top, left bottom, from(#fecf23), to(#fd9215));background-image: -webkit-linear-gradient(top, #fecf23, #fd9215);background-image: -moz-linear-gradient(top, #fecf23, #fd9215);background-image: -ms-linear-gradient(top, #fecf23, #fd9215);background-image: -o-linear-gradient(top, #fecf23, #fd9215);background-image: linear-gradient(top, #fecf23, #fd9215); background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);}
.voteprogress .vote3 {background-color: #a5df41;background-image: -webkit-gradient(linear, left top, left bottom, from(#a5df41), to(#4ca916));background-image: -webkit-linear-gradient(top, #a5df41, #4ca916);background-image: -moz-linear-gradient(top, #a5df41, #4ca916);background-image: -ms-linear-gradient(top, #a5df41, #4ca916);background-image: -o-linear-gradient(top, #a5df41, #4ca916);background-image: linear-gradient(top, #a5df41, #4ca916);  background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);}
.voteprogress .vote4 {background-color: #3FA4DE;background-image: -webkit-gradient(linear, left top, left bottom, from(#3FA4DE), to(#2185C0));background-image: -webkit-linear-gradient(top, #3FA4DE, #2185C0);background-image: -moz-linear-gradient(top, #3FA4DE, #2185C0);background-image: -ms-linear-gradient(top, #3FA4DE, #2185C0);background-image: -o-linear-gradient(top, #3FA4DE, #2185C0);background-image: linear-gradient(top, #3FA4DE, #2185C0);  background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);}
.voteprogress .vote5 {background-color: #E7827E;background-image: -webkit-gradient(linear, left top, left bottom, from(#E7827E), to(#DD514C));background-image: -webkit-linear-gradient(top, #E7827E, #DD514C);background-image: -moz-linear-gradient(top, #E7827E, #DD514C);background-image: -ms-linear-gradient(top, #E7827E, #DD514C);background-image: -o-linear-gradient(top, #E7827E, #DD514C);background-image: linear-gradient(top, #E7827E, #DD514C); background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89406', GradientType=0);}
.shinee span{position:relative}
.shinee span::after&#123;content:'';opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;background:#000;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-webkit-animation:animate-shine 2s ease-out infinite;-moz-animation:animate-shine 2s ease-out infinite}
@-webkit-keyframes animate-shinee{0%{opacity:0;width:0}50%{opacity:.5}100%{opacity:0;width:95%}}@-moz-keyframes animate-shinee{0%{opacity:0;width:0}50%{opacity:.5}100%{opacity:0;width:95%}}

Tinka: 9.4,9.6,9.7,9.8,10.0,10.1,10.2

Komentarai

Informacija

Mielas lankytojau. Tu čia esi kaip neregistruotas vartotojas.
Mes siūlome tau užsiregistruoti arba tiesiog prisijungti naudojant savo prisijungimo duomenis, tam, kad galėtum įkelti bei komentuoti norimas naujienas.

Susirašinėjimai