jQWidgets es un marco de JavaScript para crear aplicaciones basadas en web para PC y dispositivos móviles. Es un marco muy potente, optimizado, independiente de la plataforma y ampliamente compatible. jqxTagCloud se usa para mostrar un conjunto de etiquetas generadas por el usuario que acompañan a los artículos, publicaciones o videos en un sitio web.
La propiedad maxColor se utiliza para establecer u obtener la propiedad maxColor para especificar el color de las etiquetas de los elementos con el atributo de mayor valor. Sus valores posibles son todos los colores compatibles con el navegador, incluido el rgba.
Sintaxis:
-
Para establecer la propiedad maxColor .
$('#jqxTagCloud').jqxTagCloud({ maxColor: 'red' }); -
Para obtener la propiedad maxColor .
var value = $('#jqxTagCloud').jqxTagCloud({ 'maxColor' });
Archivos vinculados: descargue jQWidgets desde el enlace dado. En el archivo HTML, busque los archivos de script en la carpeta descargada.
<link rel=”hoja de estilo” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”scripts/jquery.js”></ script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxdata.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxtagcloud.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqx-all.js”></script>
Ejemplo: El siguiente ejemplo ilustra la propiedad jQWidgets jqxTagCloud maxColor . En el siguiente ejemplo, el valor de la propiedad maxColor se ha establecido en ‘rojo’.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="jqwidgets/styles/jqx.base.css"
type="text/css"/>
<script type="text/javascript"
src="scripts/jquery.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxcore.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxdata.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxtagcloud.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqx-all.js">
</script>
</head>
<body>
<center>
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h3>
jQWidgets jqxTagCloud maxColor Property
</h3>
<div id="Tag_Cloud"></div>
<input type="button" style="margin:28px;"
id="button_for_maxColor"
value="Value of the maxColor property"/>
<div id="log"></div>
<script type="text/javascript">
$(document).ready(function ()
{
var Data_for_TagCloud = [
{ Name: "GFG", Rating: 4 },
{ Name: "is a", Rating: 3 },
{ Name: "CS", Rating: 2 },
{ Name: "Portal.", Rating: 5 },
];
var dataAdapter = new
$.jqx.dataAdapter({
localData: Data_for_TagCloud
});
$('#Tag_Cloud').jqxTagCloud({
width: 450,
source: dataAdapter,
displayMember: 'Name',
valueMember: 'Rating',
maxColor: 'red',
minColor: 'black'
});
$("#button_for_maxColor").
jqxButton({
width: 300
});
$("#button_for_maxColor").jqxButton().
click(function () {
var Value_of_maxColor =
$('#Tag_Cloud').jqxTagCloud('maxColor');
$("#log").html((Value_of_maxColor));
});
});
</script>
</center>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por Kanchan_Ray y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA