jQuery Mobile es una tecnología basada en la web que se utiliza para crear contenido receptivo al que se puede acceder en todos los teléfonos inteligentes, tabletas y computadoras de escritorio. En este artículo, usaremos la opción jQuery Mobile Page contentTheme para configurar el esquema de color para el div de contenido del widget de página especificado. Esta opción acepta una sola letra de la az que se asigna a las muestras incluidas en el tema.
Sintaxis: inicialización de la página con la opción contentTheme especificada.
$( "Selector" ).page({ contentTheme: "c"});
-
Configuración de la opción contentTheme:
$( "Selector" ).page( "option", "contentTheme", "c");
-
Obtener la opción contentTheme:
var disabled = $( "Selector" ).page( "option", "contentTheme" );
Enlace CDN: Primero, agregue los scripts de jQuery Mobile necesarios para su proyecto.
<enlace rel=”hoja de estilo” href=”//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.css”>
<script src=” //code.jquery.com/jquery-3.2.1.min.js”></script>
<script src=”//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile- 1.5.0-alpha.1.min.js”></secuencia de comandos>
Ejemplo: Este ejemplo describe la opción contentTheme de jQuery Mobile Page .
HTML
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet"
href=
"//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.css">
<script src=
"//code.jquery.com/jquery-3.2.1.min.js">
</script>
<script src=
"//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.js">
</script>
</head>
<body>
<center>
<div data-role="page" id="GFG">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h3>jQuery Mobile Page contentTheme Option</h3>
<div role="main" class="ui-content">
<h2>Page content</h2>
<p>GFG is a CS Portal.</p>
</div>
<div data-role="footer">
<h3>www.geeksforgeeks.org</h3>
</div>
<input type="button" id="Button"
value="Value of the contentTheme option">
<div id="log"></div>
</div>
</center>
<script>
$(document).ready(function () {
$("#GFG").page({
contentTheme: "c"
});
$("#GFG").page("option", "contentTheme", "c");
$("#Button").on('click', function () {
var a = $("#GFG").page(
"option", "contentTheme"
);
$("#log").html(a);
});
});
</script>
</body>
</html>
Producción:
Contenido de la página de jQuery MobileOpción de tema
Referencia: https://api.jquerymobile.com/page/#option-contentTheme
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