• Página 1 de 1
  • 1
Moderador del foro: ZorG  
Foro uCoz » Información General » Para los principiantes » RANKING DE LOS MATERIALES
RANKING DE LOS MATERIALES
GUARAGUAO
Mensajes: 2362
Reputación: 81
Mensaje Nº 1 | 4:06 PM 2009-02-27
En “Control de plantillas (CSS)”:

Quote
.rating {
color: #757575;
font: 11px tahoma;
width: 85px;
height: 16px;
}
.unit-rating {
list-style: none;
margin: 0px;
padding: 0px;
width: 85px;
height: 16px;
position: relative;
background: url(http://heroes-ru.info/img/rating/rating.gif) repeat-x top left;
}
.unit-rating li {
text-indent: -90000px;
padding: 0px;
margin: 0px;
float:left;
} /*heroes-ru.info*/
.unit-rating li a {
display: block;
width: 17px;
height: 16px;
text-decoration: none;
text-indent:-9000px;
z-index: 17;
position: absolute;
padding: 0px;
}
.unit-rating li a:hover {
background-image: url(http://heroes-ru.info/img/rating/rating.gif);
background-position: left center;
z-index: 2;
left: 0px;
}
.unit-rating a.r1-unit {
left: 0px;
}
.unit-rating a.r1-unit:hover {
width: 17px;
}
.unit-rating a.r2-unit {
left: 17px;
}
.unit-rating a.r2-unit:hover {
width: 34px;
}
.unit-rating a.r3-unit {
left: 34px;
}
.unit-rating a.r3-unit:hover {
width: 51px;
}
.unit-rating a.r4-unit {
left: 51px;
}
.unit-rating a.r4-unit:hover {
width: 68px;
}
.unit-rating a.r5-unit {
left: 68px;
}
.unit-rating a.r5-unit:hover {
width: 85px;
}
.unit-rating li.current-rating {
background-image: url(http://heroes-ru.info/img/rating/rating.gif);
background-position: left bottom;
position: absolute;
height: 16px;
display: block;
text-indent: -9000px;
z-index: 1;
}

Ahora abrimos la plantilla de la página del material y comentarios a éste
Мódulo “Noticias”
Página del material y comentarios a éste:

Code

<?if($RATE_FORM$)?><span id='rt$ID$'><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif')"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ENTRY_ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-1-$ID$-15-1',{success: function(o){ getaruond$ENTRY_ID$(1); ParseXML(o.responseXML);}}); return false }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-2-$ID$-15-1',{success: function(o){ getaruond$ENTRY_ID$(1); ParseXML(o.responseXML);}}); return false }">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-3-$ID$-15-1',{success: function(o){ getaruond$ENTRY_ID$(1); ParseXML(o.responseXML);}}); return false }">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-4-$ID$-15-1',{success: function(o){ getaruond$ENTRY_ID$(1); ParseXML(o.responseXML);}}); return false }">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-5-$ID$-15-1',{success: function(o){ getaruond$ENTRY_ID$(1); ParseXML(o.responseXML);}}); return false }">5</a></li>
[/list]
</span></span></span>
<script type="text/javascript">
document.getElementById('ids$ENTRY_ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ENTRY_ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ENTRY_ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>


Aspecto de los materiales:

Code
<?if($RATE_FORM$)?><span id='rt$ID$'><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif')"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm(¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-1-$ID$-15-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-2-$ID$-15-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-3-$ID$-15-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-4-$ID$-15-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/news/0-0-5-$ID$-15-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">5</a></li>
[/list]
</span></span></span>
<script type="text/javascript">
document.getElementById('ids$ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>

Catálogo de archivos:

Code
<?if($RATE_FORM$)?><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif)"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/load/0-1-1-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/load/0-1-2-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/load/0-1-3-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/load/0-1-4-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/load/0-1-5-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">5</a></li>
[/list]
</span></span>
<script type="text/javascript">
document.getElementById('ids$ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>

Álbum de fotos

Code
<?if($RATE_FORM$)?><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif')"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/photo/$CID$-1-$ID$-13-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm(¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/photo/$CID$-1-$ID$-13-2',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); }">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/photo/$CID$-1-$ID$-13-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); }">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/photo/$CID$-1-$ID$-13-4',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); }">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/photo/$CID$-1-$ID$-13-5',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); }">5</a></li>
[/list]
</span></span>
<script type="text/javascript">
document.getElementById('ids$ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>

Blog

Code
<?if($RATE_FORM$)?><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif')"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/blog/0-0-1-$ID$-14-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/blog/0-0-2-$ID$-14-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/blog/0-0-3-$ID$-14-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/blog/0-0-4-$ID$-14-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/blog/0-0-5-$ID$-14-1',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">5</a></li>
[/list]
</span></span>
<script type="text/javascript">
document.getElementById('ids$ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif'" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>

Catálogo de artículos

Code
<?if($RATE_FORM$)?><span id='ratig-layer' style="float: left; background: url('http://heroes-ru.info/img/rating/$RATING_NUM$.gif'')"><span class="rating">
<ul class="unit-rating">
<li class="current-rating" id="ids$ID$" style="width:0px;">0</li>
[*]<a href="#" title="Mal" class="r1-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/publ/0-1-1-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false }">1</a></li>
[*]<a href="#" title="Pasable" class="r2-unit" onclick="if (confirm('¿Confirma Ud su evaluación?')){var cObj=uz.util.Connect.asyncRequest('GET','/publ/0-1-2-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">2</a></li>
[*]<a href="#" title="Ordinario" class="r3-unit" onclick="if (confirm('¿Confirma Ud 3?')){var cObj=uz.util.Connect.asyncRequest('GET','/publ/0-1-3-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">3</a></li>
[*]<a href="#" title="Bien" class="r4-unit" onclick="if (confirm('¿Confirma Ud 4?')){var cObj=uz.util.Connect.asyncRequest('GET','/publ/0-1-4-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">4</a></li>
[*]<a href="#" title="Excelente" class="r5-unit" onclick="if (confirm('¿Confirma Ud 5?')){var cObj=uz.util.Connect.asyncRequest('GET','/publ/0-1-5-$ID$-3',{success: function(o){ getaruond$ID$(1); ParseXML(o.responseXML);}}); return false}">5</a></li>
[/list]
</span></span>
<script type="text/javascript">
document.getElementById('ids$ID$').style.width=17*$RATING$+'px';
var i = 0;
function getaruond$ID$(x){
if(!i){
var q = $RATED$*$RATING$;
var w = (q+x)/($RATED$+1);
document.getElementById('ids$ID$').style.width=17*w+'px';
i++;
}}
</script>
<?else?><img src="http://heroes-ru.info/img/rating/$RATING_NUM$.gif'" align=absmiddle valign=center border=0 alt="Ranking del material: $RATING$/$RATED$"><?endif?>

El siguiente enlace http://heroes-ru.info/img/rating/ ha de estar sustituido con lo tuyo.

Las vírgenes tienen muchas navidades pero ninguna Nochebuena.
GUARAGUAO
Mensajes: 2362
Reputación: 81
Mensaje Nº 2 | 2:57 PM 2010-11-23
Crea un sistema de votaciones con jQuery Raty

jQuery Raty es un plugin creado para jQuery que nos permite crear un sistema de rating en nuestro sitio que sea fácil de utilizar y muy simple de implementar.

Este plugin se caracteriza por lo ligero que es, ya que ocupa unos 4 Kb en su versión comprimida.

Su funcionamiento es muy sencillo, ya que solo necesitamos crear un contenedor DIV con un id y hacer llamada al plugin.

El ejemplo más sencillo es cuando no tiene ninguna opción. Es el siguiente código.

Quote
$('#default').raty();
<div id="default"></div>

Si queremos que el sistema empiece ya con un valor determinado, se puede utilizar la opción “start”

Quote
$('#fixed').raty({
readOnly: true,
start: 2
});
<div id="fixed"></div>

En el ejemplo anterior también hemos hecho uso de la propiedad “readOnly”, para indicar que el elemento es de solo lectura.

Cuando un elemento es de solo lectura, se puede poner un mensaje que indique información al respecto. Para ello se utiliza la propiedad “noRatedMsg”.

Quote
$('div#anyone').raty({
readOnly: true,
noRatedMsg: 'anyone rated this product yet!'
});

<div id="anyone"></div>

También se puede una puntuación con nombre personalizado y también personalizar el número de estrellas que aparecen.

Quote
$('#number').raty({
scoreName: 'entity.score',
number: 10
});

<div id="number"></div>

También se pueden utilizar funciones dentro de la llamada, capturando el evento onClick. Os dejamos el código.

Quote
$('#click').raty({
onClick: function(score) {
alert('score: ' + score);
}
});

<div id="click"></div>

También se puede indicar que se muestren medias estrellas. Para ello utilizamos la propiedad “showHalf” a true.

Quote
$('#half').raty({
start: 3.3,
showHalf: true
});
<div id="half"></div>

Otra opción que nos permite, es modificar el nombre que aparece por defecto en las estrellas. Esto se hace utilizando la siguiente propiedad.

Quote
hintList: ['bad', 'poor', 'regular', 'good', 'gorgeous']

Como véis, es sencillo utilizar el plugin. Podéis ver sobre este plugin, mirando en su página oficial.

Las vírgenes tienen muchas navidades pero ninguna Nochebuena.
Goto3
Mensajes: 7
Reputación: 0
Mensaje Nº 3 | 8:16 PM 2013-02-05
Se puede hacer un ranking semanal con esto?
Foro uCoz » Información General » Para los principiantes » RANKING DE LOS MATERIALES
  • Página 1 de 1
  • 1
Búscar: