Buen dia,
Este es mi primer post, no tengo muchos conocimientos acerca de programacion ni diseño web, diria yo los basicos, estoy elaborando una pagina web ([URL="http://frontwebos.web.officelive.com"]FrontWebOS[/URL]), y pues como vera la pagina simula ser el escritorio de un equipo normal, con el fin de tener a la mano los enlaces de interese de los usuarios (no esta de mas los comentarios buenos o malos con tal de mejorar), y como dicen al grano.
La pagina deberia ser personalisable, ya almenos me consegui un script el cual me permite ya sea poner una imagen de fondo o color que desee el usuario (este dura por 30 dias segun la cookie), lo mismo con la imagen de perfil, ahora estoy agregandole la opcion de que las personas puedan elegir el color de fondo y de borde del contendor de los elementos el cual es un div, hasta ahi todo bien, ya puedo cambiar el color de fondo y del borde de dicho div (aun no la he subido), pero ahora en vez de que el usuario le aparesca un "prompt" pidiendo el color que desea poner como fondo y borde del contenedor quiero que me aparesca una paleta de colores y que el usuario al seleccionar el color automaticamente se aplique.
asi qeu cualqueir ayuda no estara de mas, agradesco la colaboracion, aca pongo el codigo de prueba que estoy haciendo.
Código:
/* -------------------Javascript con Cookie --------------*/
//color Fondo
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function cold(){
var favColor = GetCookie('colorb');
if (favColor == null) {
SetCookie('colorb', favColor, exp);
}
document.getElementById("container").style.background=favColor;
return favColor;
}
function cold1(){
favColor = prompt("COlor COntenedor");
SetCookie ('colorb', favColor, exp);
}
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
// Fin color Fondo
//color borde
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function bord(){
var favColor = GetCookie('colorbo');
if (favColor == null) {
SetCookie('colorbo', favColor, exp);
}
document.getElementById("container").style.borderColor=favcolor;
return favColor;
}
function bord1(){
favColor = prompt("Escribe color de Fondo")
SetCookie ('colorbo', favColor, exp);
}
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
// Fin color borde Fondo
Código:
/*----------------html-------------*/
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es-ES">
<head>
<script type="text/javascript" src="js/general2.js"></script>
</head>
<div id="container" style="border: 5px blue solid;width:800; height: 500;filter:alpha(opacity=50);-moz-opacity:0.5">
<a href="JavaScript:cold1()" class="style1">
Cambiar Imagen COntenedor</a>
<a href="JavaScript:bord1()" class="style1">
Cambiar borde COntenedor</a>
<script type="text/javascript">
document.getElementById("container").style.background(cold());
</script>
<script type="text/javascript">
document.getElementById("container").style.borderColor(bord());
</script>
</div>
</body>
</html>
Agradeciendo de nuevo vuestra colaboracion