1<!DOCTYPE html> 2<html> 3<head> 4<!-- This site is hosted on Netlify. Anyone can build and deploy a site 5 like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=d59f0223-afcc-443e-bc4d-711d0940c241 6 Netlify hosting facts for this site: static/SSR served via Netlify Edge. --> 7<title>guia de como usar </title> 8 <link href="https://pixels.crd.co/assets/images/gallery15/10dde2ea.gif?v=99d3974e" rel="shortcut icon" type="image/gif"> 9 <meta name="description" content="the cutest website on the internet!"> 10<style> 11body{ 12display: block; 13background-image: url(fondoweb/fondo\ tuto.png); 14Background-size: cover; 15background-repeat: repeat; /* Esto asegura que el GIF se repita para llenar el espacio */ 16background-size: auto; /* Vuelve al tamaño original del GIF, no lo estira */ 17background-position: center center; /* Sigue centrando el patrón si la pantalla no es un múltiplo exacto del GIF */ 18background-attachment: fixed; /* Mantiene el fondo fijo al hacer scroll */ 19margin: 0; 20overflow-x: hidden; /* Evita el scroll horizontal */ 21min-height: 100vh; 22font-family: 'Comic Sans MS', 'Comic Sans', cursive; 23color: rgb(255, 101, 191); 24text-align: center; 25line-height: 1.6; 26} 27 28.box-main{ 29border: 1px solid hotpink; 30background-color: white; 31width: 1000px; 32/* Increased height to accommodate all content, adjust as needed */ 33height: 1200px; 34display: block; 35margin: auto; 36border-width:8px; 37border-style:solid; 38background-image: url("https://i.pinimg.com/736x/5a/07/d1/5a07d12d9995bc8930ff7b030db6c022.jpg"); 39border-image: url("https://i.ibb.co/h1Q3bFn/83-B27704-CEA1-4-B8-F-BF79-90-D624-EDC6-F6.png") 8 fill round; 40} 41 42.box-banner{ 43border: 1px solid hotpink; 44background-color: white; 45width: 1000px; 46height:300px; 47display: block; 48margin: auto; /* Centers the banner within its parent, which is already centered */ 49background-image: url(banners/bnnguia.png); 50background-size: cover; 51} 52.marq{ 53background: linear-gradient(#e8bdd7 , hotpink 40%, #e6add8); 54color: white; 55display: block; 56margin: auto; 57} 58/* Contenedor para Umbreon, Leafeon y Espeon */ 59.umbreon-leafeon-espeon-container { 60 display: flex; /* Usa flexbox para la disposición horizontal */ 61 justify-content: center; /* Centra los elementos horizontalmente si es necesario */ 62 margin-top: 10px; /* Mantiene el margen superior */ 63 /* Ensure this container respects the width of its parent */ 64 width: 100%; 65} 66 67.umbreon{ 68border: 1px solid hotpink; 69background-color: rgba(255, 188, 230, 0.604); 70width: 295px; /* Reducido el ancho para dejar espacio */ 71height:450px; 72margin-right: 10px; /* Agrega un margen a la derecha para separarlos */ 73overflow: auto; 74text-align: left; /* Align text within umbreon to the left for readability */ 75padding: 5px; /* Add some padding for content */ 76box-sizing: border-box; /* Include padding in the width/height */ 77} 78 79.galeria-imagenes-debajo { 80 display: flex; /* Esto hace que las imágenes se coloquen en fila */ 81 flex-wrap: wrap;
81 /* Esto permite que las imágenes salten a la siguiente lÃnea si no caben */ 82 gap: 5px; /* Espacio entre cada imagen */ 83 justify-content: flex-start; /* Alinea las imágenes al inicio del contenedor */ 84 max-width: 195px; /* **Importante**: Limita el ancho de la galerÃa para que no se extienda más allá de tu caja umbreon */ 85 /* Si quieres que la galerÃa sea más ancha que umbreon, ajusta este valor */ 86} 87 88.galeria-imagenes-debajo img { 89 width: 180px; /* Ajusta el tamaño de tus imágenes para que quepan bien */ 90 height: auto; /* Mantiene la proporción original de la imagen */ 91 border: 1px solid #ccc; /* Un borde sutil para las imágenes */ 92 padding: 3px; /* Pequeño relleno dentro del borde */ 93} 94 95.leafeon{ 96border: 1px solid hotpink; 97background-color: rgb(255, 188, 230); 98width: 600px; /* Reducido el ancho para dejar espacio */ 99height:440px; 100margin-right: 10px; /* Agrega un margen a la derecha para separarlos */ 101text-align: center; /* Center text within leafeon */ 102padding: 5px; /* Add some padding for content */ 103box-sizing: border-box; /* Include padding in the width/height */ 104} 105 106/* New container for the elements that were floated */ 107.bottom-boxes-container { 108 display: flex; 109 flex-wrap: wrap; /* Allow items to wrap to the next line */ 110 justify-content: center; /* Center the boxes horizontally */ 111 width: 980px; /* Match the width of .stamps for consistency */ 112 margin: 10px auto; /* Center this container within box-main */ 113 gap: 10px; /* Space between the boxes */ 114} 115 116 .jolteon { 117 border: 1px solid hotpink; 118 background-color: rgba(255, 188, 230, 0.604); 119 /* Remove float and adjust margin to work with flexbox */ 120 margin: 0; 121 box-sizing: border-box; /* Include padding/border in the width/height */ 122 padding: 5px; /* Add some padding for content */ 123} 124 125.flareon{ 126width:280px; 127height:321px; 128background-color: rgba(255, 255, 255, 0); 129} 130.stamps{ 131border: 1px solid rgb(255, 45, 139); 132background-color: white; 133width: 980px; 134height:56px; 135margin: 10px auto; /* Center this box */ 136display: flex; /* Use flexbox to center images within it */ 137justify-content: center; 138align-items: center; 139overflow: hidden; /* Hide overflow from the images if they are too big */ 140} 141.stamps img { 142 max-height: 50px; /* Ensure stamps don't exceed the height of the box */ 143 width: auto; /* Maintain aspect ratio */ 144 margin: 0 5px; /* Space between stamps */ 145} 146.jolteon{ 147width:500px; 148height:320px; 149overflow-x: hidden; 150} 151.vaporeon{ 152width:500px; 153height:320px; 154border: 1px solid rgba(255, 105, 180, 0); 155background-color: rgba(255, 188, 230, 0.604); 156} 157 158 159@font-face{ 160 font-family:'Legacy'; 161 src:url(https://files.catbox.moe/vb0fng.otf); 162} 163 164#vocaring{ 165 width:fit-content; 166 height:fit-content; 167 margin: auto; 168} 169 170.vocacontainer::selection { 171 background:#4cd4de; 172 color:white; 173} 174 175.vocacontainer::-moz-selection { 176 background:#4cd4de; 177 color:white; 178} 179 180.vocacontainer{ 181 width:210px; 182 height:fit-content; 183 padding:10px; 184 background-color:#c9eff2; 185 border:4px solid #4cd4de; 186 box-sizing:border-box; 187 margin: auto; 188} 189 190.vocacontainer table { 191 margin:0; 192} 193 194.vocacontainer .webring-info { 195 text-align:center; 196 font-family:'Legacy'; 197 color:#e74492; 198 font-size:27px; 199 letter-spacing:3px; 200 text-shadow:#ffffff 2px 0px 0px, #ffffff 1.75517px 0.958851px 0px, #ffffff 1.0806px 1.68294px 0px, #ffffff 0.141474px 1.99499px 0px, #ffffff -0.832294px 1.81859px 0px, #ffffff -1.60229px 1.19694px 0px, #ffffff -1.97999px 0.28224px 0px, #ffffff -1.87291px -0.701566px 0px, #ffffff -1.30729px -1.51361px 0px, #ffffff -0.421592px -1.95506px 0px, #ffffff 0.567324px -1.91785px 0px, #ffffff 1.41734px -1.41108px 0px, #ffffff 1.92034px -0.558831px 0px; 201 line-height:100%; 202 margin-bottom:5px; 203} 204 205.vocacontainer .webring-links{ 206 font-size:17px; 207 font-family:'Arial'; 208 color:#e74492; 209} 210 211.vocacontainer .webring-links a{ 212 text-decoration: none; 213 color:#e74492; 214 text-shadow:#ffffff 2px 0px 0px, #ffffff 1.75517px 0.958851px 0px, #ffffff 1.0806px 1.68294px 0px, #ffffff 0.141474px 1.99499px 0px, #ffffff -0.832294px 1.81859px 0px, #ffffff -1.60229px 1.19694px 0px, #ffffff -1.97999px 0.28224px 0px, #ffffff -1.87291px -0.701566px 0px, #ffffff -1.30729px -1.51361px 0px, #ffffff -0.421592px -1.95506px 0px, #ffffff 0.567324px -1.91785px 0px, #ffffff 1.41734px -1.41108px 0px, #ffffff 1.92034px -0.558831px 0px; 215 filter:drop-shadow( 0 2px var(--bc)) drop-shadow( 2px 0 var(--bc)) drop-shadow( 0 -2px var(--bc)) drop-shadow(-2px 0 var(--bc)); 216 transition:0.3s; 217} 218 219.vocacontainer .webring-links a:hover{ 220 letter-spacing:normal; 221} 222 223.vocacontainer img { 224 display:inline !important; 225 image-rendering:pixelated; 226} 227.leafeon img { 228 display: block; /* Hacer que la imagen ocupe una lÃnea completa */ 229 margin: 10px auto 0; /* Espacio arriba, centrado horizontalmente, sin espacio abajo */ 230 max-width: 100%; /* Asegurar que la imagen no exceda el ancho del contenedor */ 231 height: auto; /* Mantener la proporción de la imagen */ 232 } 233/* For Webkit browsers (Chrome, Safari, Edge) */ 234::-webkit-scrollbar { 235 width: 10px;
235 /* Adjust width as needed */ 236} 237 238::-webkit-scrollbar-thumb { 239 background-color: #e74492; /* Light pink color */ 240 border-radius: 5px; /* Optional: for rounded corners */ 241} 242 243::-webkit-scrollbar-track { 244 background-color: #ffdff1; /* Optional: color of the scrollbar track */ 245} 246 247/* For Firefox */ 248/* You might need to enable this in Firefox's about:config by setting widget.non-native-theme.enabled to true */ 249* { 250 scrollbar-color: #e74492 #ffdff1; /* thumb and track color */ 251 scrollbar-width: thin; /* You can also use "auto" or "none" */ 252} 253.boton-esquina { 254 border: 1px solid hotpink; 255 background: linear-gradient(#e8bdd7 , hotpink 40%, #e6add8); 256 color: white; 257 width: 80px; 258 height:40px; 259 position: fixed; /* Fija el botón en la ventana del navegador */ 260 top: 10px; /* Ajusta la distancia desde la parte superior */ 261 left: 10px; /* Ajusta la distancia desde la izquierda */ 262 } 263 264 .gif-esquina { 265 position: fixed; /* Mantiene el GIF fijo en la ventana, incluso al hacer scroll */ 266 width: 100px; /* Tamaño del GIF, puedes ajustarlo */ 267 height: auto; /* Mantiene la proporción original del GIF */ 268 z-index: 999; /* Asegura que el GIF esté por encima de la mayorÃa de los otros elementos */ 269 bottom: 7px; 270 left: 7px; 271 272 /* --- ESQUINA INFERIOR DERECHA --- */ 273 /* bottom: 10px; */ 274 /* right: 10px; */ 275 276 } 277 278 .marcador-personalizado { 279 background-color: #ffffffdd; /* Un amarillo brillante, puedes cambiarlo */ 280 padding: 1px 2px; /* Espacio alrededor del texto */ 281 border-radius: 3px; /* Bordes ligeramente redondeados */ 282 box-decoration-break: clone; /* Para frases que ocupan varias lÃneas */ 283 } 284 285 286</style> 287</head> 288<body> 289 290 <div class="resolucion"> 291 292 <div class="desktop"> 293 294 </div> 295 296 <div class="tablet"> 297 298 </div> 299 300 <div class="movil"> 301 302 </div> 303 304 <style type="text/css">* {cursor: url(https://ani.cursors-4u.net/symbols/sym-8/sym759.ani), url(https://ani.cursors-4u.net/symbols/sym-8/sym759.png), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2014/03/25/pink-spinning-heart-within-a-heart.html" target="_blank" title="Pink Spinning Heart Within A Heart"><img src="https://cur.cursors-4u.net/cursor.png" border="0" alt="Pink Spinning Heart Within A Heart" style="position:absolute; top: 0px; right: 0px;" /></a> 305 306 <button class="boton-esquina" onclick="redirigir()"><img src="https://pixels.crd.co/assets/images/gallery16/8b717079.gif?v=99d3974e"></button> 307 308 <div class="box-main"> 309 <div class="box-banner"></div> 310 311 <div class="marq"><marquee> 312 <div style="text-align: center; font-size: 15px; font-family: 'Comic Sans MS', cursive; color: rgb(255, 255, 255); margin-bottom: 5px;"> 313 If you speak English or another language, translate this page using your browser's automatic translation! 314 </div> 315 <img src="https://external-media.spacehey.net/media/sWPhBsAOInzIqj9NZWaUQ8iknzt4eEnq55J1svwj5Xlw=/https://i.postimg.cc/dtw7GFXz/111321e3ewfd.png "> 316 <img src="https://mimikitty49.neocities.org/stamps/YAY/image%20(2).png"> 317 <img src="https://confettiguts.gay/graphics/graphicsimg/gloomy2.png"> 318 <img src="https://file.garden/ZRd9Ymec0nPTUKfu/Stamps/Stamp_Korilakkuma"> 319 <img src="https://raining-starss.neocities.org/gittyimages%20(12).png "> 320 <img src=" https://allyratworld.com/stamps/bunnyplushies.png "> 321 <img src="https://y2k.neocities.org/stamps/tumblr_inline_pe6lbw4Zzw1v11djx_1280.gif "> 322 <img src=" https://y2k.neocities.org/stamps/tumblr_pgf5mzpwtc1xzybrpo6_100.gif "> 323 <img src="https://y2k.neocities.org/stamps2/i_love_you___stamp_by_tifa22.gif "> 324 <img src=" https://adriansblinkiecollection.neocities.org/stamps/k11.png "> 325 <img src="https://allyratworld.com/stamps/daubo2k-11312915-1e32-4c09-ad33-d27cdaeeb08b.png "> 326 <img src=" https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/75f1c674-3368-4736-9dbd-cabb484217f6/d85h30l-dfe181ed-0725-4bee-90d0-6a098d318daa.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc1ZjFjNjc0LTMzNjgtNDczNi05ZGJkLWNhYmI0ODQyMTdmNlwvZDg1aDMwbC1kZmUxODFlZC0wNzI1LTRiZWUtOTBkMC02YTA5OGQzMThkYWEuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bm5sb2FkIl99.KukL8D5Rb3sTPUSSFcfWxGVzIYoGy6nCm-prXTBXm90"> 327 <img src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ecc4bc54-aa20-47d3-b080-4fd35a4a42e7/daxsrvl-7d8fabce-c54c-4920-8985-acf459acfcb4.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2VjYzRiYzU0LWFhMjAtNDdkMy1iM
327DgwLTRmZDM1YTRhNDJlN1wvZGF4c3J2bC03ZDhmYWJjZS1jNTRjLTQ5MjAtODk4NS1hY2Y0NTlhY2ZjYjQucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.kkqAtq66OgCF0rJmNBaU1Qdn_-RDhoGNQaEtXaUK7Dk "> 328 <img src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac868cfc-97d0-4be0-bea4-3e61357184a4/dd025ug-8847f3e8-3980-40a1-b0b3-3001733866f3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2FjODY4Y2ZjLTk3ZDAtNGJlMC1iZWE0LTNlNjEzNTcxODRhNFwvZGQwMjV1Zy04ODQ3ZjNlOC0zOTgwLTQwYTEtYjBiMy0zMDAxNzMzODY2ZjMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.3aLKOmNITYj98IfPT1xWndd6Kbp1UnOrgbj1UjGKAlM "> 329 <img src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/ac868cfc-97d0-4be0-bea4-3e61357184a4/dczyo7k-0cf2fde7-0501-438d-a9bf-b01d3e8c10ba.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2FjODY4Y2ZjLTk3ZDAtNGJlMC1iZWE0LTNlNjEzNTcxODRhNFwvZGN6eW83ay0wY2YyZmRlNy0wNTAxLTQzOGQtYTliZi1iMDFkM2U4YzEwYmEuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.bLT0b5hkIHxGIAw_vG-af-3S7OZtQgAblUbB16ymn84 "> 330 331</marquee></div> 332 333 <div class="umbreon-leafeon-espeon-container"> 334 <div class="umbreon"> 335 <div class="marq">Acerca de mi</div> 336 <p><span class="marcador-personalizado"> hola soy candy<img src="https://pixels.crd.co/assets/images/gallery16/efb14d34.gif?v=99d3974e">, una diseñadora gráfica independiente y soy nueva en el mundo de la programación web.<img src="https://pixels.crd.co/assets/images/gallery23/5d01c397.gif?v=99d3974e"></span> 337 <br> 338 <p><span class="marcador-personalizado"><img src="https://pixels.crd.co/assets/images/gallery09/c20f17fc.gif?v=99d3974e"> Siempre me ha apasionado crear y aprender, por lo cual me llevó a la creación de este proyecto para seguir desarrollando mis habilidades.</span> 339 <br> 340 <p><span class="marcador-personalizado"> <img src="https://pixels.crd.co/assets/images/gallery15/7240c631.gif?v=99d3974e">La idea inicial de este proyecto inicio cuando me percate que no existen programas o paginas para pc/laptop<img src="https://pixels.crd.co/assets/images/gallery16/1993d91d.png?v=99d3974e"> que permitan tomarse fotos bonitas al estilo Purikura<img src="https://pixels.crd.co/assets/images/gallery08/69498c83.gif?v=99d3974e"> 341 <span class="marcador-personalizado">por lo cual, me anime a desarrollar una versión más versátil desde cero, que poco a poco iré mejorando.<img src="https://pixels.crd.co/assets/images/gallery08/6f7e964d.gif?v=99d3974e"></span> 342 <br> 343 <p><span class="marcador-personalizado"> Me inspire en la estetica GYARU <img src="https://pixels.crd.co/assets/images/gallery16/f603bbe7.gif?v=99d3974e">para el diseño general del sitio web.<img src="https://pixels.crd.co/assets/images/gallery15/b7ee01df.gif?v=99d3974e"> 344 Y a pesar que, este estilo es el principal, quiero incluir varias esteticas para la proxima actualizacion.<img src="https://pixels.crd.co/assets/images/gallery09/9dd19a38.gif?v=99d3974e"><br></span> 345 <br> 346 <p><span class="marcador-personalizado"> Me he encargado de crear la mayoria de los diseños que se encuentran aqui.<img src="https://pixels.crd.co/assets/images/gallery09/64cff33f.gif?v=99d3974e"> Sin embargo, tambien he tomado algunos recursos de pinterest y rednote que han sido creados por otras personas,por lo cual les ortogo creditos a quienes crearon los stickers y marcos.<img src="https://pixels.crd.co/assets/images/gallery15/23f26d94.gif?v=99d3974e"> </span> 347 <br> 348 <p><span class="marcador-personalizado">si deseas forma parte de este pequeño proyecto, asi sea editando recursos (fondos,stickers o marcos) de forma gratuita<img src="https://pixels.crd.co/assets/images/gallery21
348/94808142.gif?v=99d3974e">, puedes mandarme un e-mail a: <u>[email protected]</u> </span> 349 <br> 350 </p> 351 </div> 352 353 <div class="leafeon"> 354 <div class="marq">¿Como usar?</div> 355 <br> 356 <div class="video-container"> 357 <iframe 358 width="590" 359 height="330" 360 src="https://www.youtube.com/embed/CywcK6deWN8" 361 frameborder="0" 362 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 363 allowfullscreen> 364 </iframe> 365 </div> 366 <br> 367 </div> 368 </div> 369 370 <div class="bottom-boxes-container"> 371 372 <div class="flareon"> 373 <div class="marq"></div> 374 <iframe src="https://www3.cbox.ws/box/?boxid=3547287&boxtag=uZbxTO" width="230" height="320" allowtransparency="yes" allow="autoplay" frameborder="0" marginheight="0" marginwidth="0" scrolling="auto"></iframe> 375 </div> 376 377 <div class="jolteon"> 378 <div class="marq">Sigueme en:</div> 379 <br> 380 <div class="button"> <a href="https://www.youtube.com/@kcandytutos"><img src="botones tutorial/yt.png" style="width: 90px;"></a> <a href="https://pin.it/1V9AJDxgJ"><img src="botones tutorial/7.png" style="width: 90px;"></a> <a href="https://www.instagram.com/kcandy_arts/"><img src="botones tutorial/8.png" style="width: 90px;"></a> 381 382 <div style="text-align: center; font-size: 13px;"> 383 <p> 384 <span class="marcador-personalizado"> 385 Si deseas contribuir de forma monetaria para la mejora continua de este sitio web, puedes hacerlo tocando el botón de abajo: 386 </span> 387 </div> 388 <div class="button"><a href="https://linktr.ee/donacion.dollystickercam?utm_source=linktree_admin_share"><img src="botones tutorial/donar btn.png" style="width: 300px;"></a></div> 389 390 <p style="font-size: 0.9em;">©All rights reserved. Dollysticker Cam 2025, a creation by Kcandyarts.</p> 391 </div> 392 393 <div class="vaporeon"> 394 <div class="marq">Actualizaciónes</div> 395 <div style="text-align: center; font-size: 15px;"> 396 <p> 397 <span class="marcador-personalizado"> 398 <img src="https://pixels.crd.co/assets/images/gallery08/0b0c7dfd.gif?v=99d3974e">Versión 1.0 - incluye: <br> 399 69 stickers <br> 400 12 Marcos <br> 401 4 botones para aumentar, disminuir y rotar stickers <br>
402 Eliminar sticker con dobleclick <br> 403 Pincel para poder dibujar <br> 404 16 texturas para dibujar <br> 405 Borrador de pincel <br> 406 Agrandar pincel <br> 407 4 Temas para el Fondo web <br> 408 Boton para poder Descargar tu foto <br> 409 Boton para volver a repetir la foto <br> 410 Boton de inicio. <br> 411 07/06/2025 412 </p> 413 414 415 <div class="gif-esquina"> 416 <img src="https://external-media.spacehey.net/media/s-UhK57aEg6fyIhZcRB44dpqUeZ6woAnQnitmdedtZr0=/https://64.media.tumblr.com/2d7f4f68a29d0af85df6c58b3fcb1ec8/d83baef18aa41cbc-9f/s250x400/9a3ed37eedb3ea79fb6c6c9a7e7312f9f11aae8c.gifv" alt="GIF decorativo"> 417 </div> 418
419<script> 420function redirigir() { 421 window.location.href = "index.html"; // Reemplaza "tu_otra_pagina.html" con la URL o ruta de tu otro archivo HTML 422} 423 424 var colour = "#fff7fc"; // in addition to "random" can be set to any valid colour eg "#f0f" or "red" 425 var sparkles = 50; 426 427 var x = 400; 428 var y = 300; 429 var ox = x; 430 var oy = y; 431 var swide = window.innerWidth; 432 var shigh = window.innerHeight; 433 var sleft = 0; 434 var sdown = 0; 435 var tiny = []; 436 var star = []; 437 var starv = []; 438 var starx = []; 439 var stary = []; 440 var tinyx = []; 441 var tinyy = []; 442 var tinyv = []; 443 444 function createDiv(height, width) { 445 var div = document.createElement("div"); 446 div.style.position = "absolute"; 447 div.style.height = height + "px"; 448 div.style.width = width + "px"; 449 div.style.overflow = "hidden"; 450 return div; 451 } 452 453 function newColour() { 454 var c = new Array(); 455 c[0] = 255; 456 c[1] = Math.floor(Math.random() * 256); 457 c[2] = Math.floor(Math.random() * (256 - c[1] / 2)); 458 c.sort(function() { return (0.5 - Math.random()); }); 459 return "rgb(" + c[0] + ", " + c[1] + ", " + c[2] + ")"; 460 } 461 462 window.onload = function() { 463 if (document.getElementById) { 464 for (var i = 0; i < sparkles; i++) { 465 var tinyParticle = createDiv(3, 3); 466 tinyParticle.className = "sparkle"; 467 tinyParticle.style.backgroundColor = colour; 468 tinyParticle.style.visibility = "hidden"; 469 document.body.appendChild(tiny[i] = tinyParticle); 470 tinyv[i] = 0; 471 472 var starContainer = createDiv(5, 5); 473 starContainer.className = "star-container"; 474 var lineHorizontal = createDiv(1, 5); 475 lineHorizontal.className = "star-line-horizontal"; 476 var lineVertical = createDiv(5, 1); 477 lineVertical.className = "star-line-vertical"; 478 starContainer.appendChild(lineHorizontal); 479 starContainer.appendChild(lineVertical); 480 lineHorizontal.style.top = "2px"; 481 lineHorizontal.style.left = "0px"; 482 lineVertical.style.top = "0px"; 483 lineVertical.style.left = "2px"; 484 document.body.appendChild(star[i] = starContainer); 485 starv[i] = 0; 486 } 487 set_width(); 488 sparkle(); 489 } 490 } 491 492 function sparkle() { 493 if (Math.abs(x - ox) > 1 || Math.abs(y - oy) > 1) { 494 ox = x; 495 oy = y; 496 for (var c = 0; c < sparkles; c++) { 497 if (!starv[c]) { 498 star[c].style.left = (starx[c] = x) + "px"; 499 star[c].style.top = (stary[c] = y + 1) + "px"; 500 star[c].style.clip = "rect(0px, 5px, 5px, 0px)"; 501 var currentColor = (colour == "random") ? newColour() : colour; 502 star[c].firstChild.style.backgroundColor = currentColor; 503 star[c].lastChild.style.backgroundColor = currentColor; 504 star[c].style.visibility = "visible"; 505 starv[c] = 50; 506 break; 507 } 508 } 509 } 510 for (var c = 0; c < sparkles; c++) { 511 if (starv[c]) update_star(c); 512 if (tinyv[c]) update_tiny(c); 513 } 514 setTimeout(sparkle, 40); 515 } 516 517 function update_star(i) { 518 if (--starv[i] == 25) star[i].style.clip = "rect(1px, 4px, 4px, 1px)"; 519 if (starv[i]) { 520 stary[i] += 1 + Math.random() * 3; 521 starx[i] += (i % 5 - 2) / 5; 522 if (stary[i] < shigh + sdown) { 523 star[i].style.top = stary[i] + "px"; 524 star[i].style.left = starx[i] + "px"; 525 } else { 526 star[i].style.visibility = "hidden"; 527 starv[i] = 0; 528 return; 529 } 530 } else { 531 tinyv[i] = 50; 532 tiny[i].style.top = (tinyy[i] = stary[i]) + "px"; 533 tiny[i].style.left = (tinyx[i] = starx[i]) + "px"; 534 tiny[i].style.width = "2px"; 535 tiny[i].style.height = "2px"; 536 tiny[i].style.backgroundColor = star[i].firstChild.style.backgroundColor; 537 star[i].style.visibility = "hidden"; 538 tiny[i].style.visibility = "visible"; 539 } 540 } 541 542 function update_tiny(i) { 543 if (--tinyv[i] == 25) { 544 tiny[i].style.width = "1px"; 545 tiny[i].style.height = "1px"; 546 } 547 if (tinyv[i]) { 548 tinyy[i] += 1 + Math.random() * 3; 549 tinyx[i] += (i % 5 - 2) / 5; 550 if (tinyy[i] < shigh + sdown) { 551 tiny[i].style.top = tinyy[i] + "px"; 552 tiny[i].style.left = tinyx[i] + "px"; 553 } else { 554 tiny[i].style.visibility = "hidden"; 555 tinyv[i] = 0; 556 return; 557 } 558 } else tiny[i].style.visibility = "hidden"; 559 } 560 561 document.onmousemove = mouse; 562 function mouse(e) { 563 if (e) { 564 y = e.pageY; 565 x = e.pageX; 566 } else { 567 set_scroll(); 568 y = event.y + sdown; 569 x = event.x + sleft; 570 } 571 } 572 573 window.onscroll = set_scroll; 574 function set_scroll() { 575 if (typeof(self.pageYOffset) == 'number') { 576 sdown = self.pageYOffset; 577 sleft = self.pageXOffset; 578 } else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) { 579 sdown = document.body.scrollTop; 580 sleft = document.body.scrollLeft; 581 } else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) { 582 sleft = document.documentElement.scrollLeft; 583 sdown = document.documentElement.scrollTop; 584 } else { 585 sdown = 0; 586 sleft = 0; 587 } 588 } 589 590 window.onresize = set_width; 591 function set_width() { 592 swide = window.innerWidth; 593 shigh = window.innerHeight; 594 } 595</script>
595 596</body> 597</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.