Windows - Como acceder a la configuración de la Bios

 Acceso a la BIOS de tu computadora

Pasos para acceso a la BIOS

• Reiniciar la pc y dejar presionada la tecla shift
• También puedes presionar varias veces F10 o F2 dependiendo, esto cuando estes accediendo de nuevo despues del reinicio. 

HTML - Código para 9 recuadros con media query

 

CÓDIGO HTML5

<main>

<!-------------- 1ERA SECCION -------------->

  <div class="row">

    <div class="column">

      <a href="https://www.paramountplus.com/"><img src="../img/paramountplus.jpg" alt="Paramount +" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://play.hbomax.com/page/urn:hbo:page:home"><img src="img/hbo.png" alt="HBO Max" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://disneyplus.com/"><img src="img/disneyplus.jpg" alt="Disney +" style="width:100%"></a>

    </div>    

    <div class="column">

      <a href="https://www.netflix.com/browse"><img src="img/netflix.jpg" alt="Netflix" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://www.starplus.com/"><img src="img/starplus.jpg" alt="Star +" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://vix.com/es-es/ondemandplus"><img src="https://img-s-msn-com.akamaized.net/tenant/amp/entityid/AAZOpTJ.img?h=0&w=600&m=6&q=60&u=t&o=f&l=f" alt="Vix +" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://serieslan.com/dragon-ball-gt"><img src="img/dragonballgt.jpg" alt="Dragon Ball GT" title="Dragon Ball GT" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://serieslan.com/los-caballeros-del-zodiaco"><img src="https://i0.wp.com/lacomikeria.com/wp-content/uploads/2022/02/33D1123B-9E73-40F4-A189-B74FDE357C54.jpeg?resize=600%2C400&ssl=1" alt="Caballeros del Zodiaco" title="Caballeros del Zodiaco" style="width:100%"></a>

    </div>

    <div class="column">

      <a href="https://vix.com/es-es/ondemandplus"><img src="img/livetv.jpg" alt="Vix +" style="width:100%"></a>

    </div>

  </div>

<!-------------- 2DA SECCION -------------->

  <div class="row">

    <div class="column">

      <a href="https://www.paramountplus.com/"><img src="../img/paramountplus.jpg" alt="Paramount +" style="width:100%"></a>

    </div>

.

.

.

</main>

CÓDIGO CSS

/************* MAIN *************/

main{

    width: 100%;

    height: auto;

    display: flex;

    flex-flow: row wrap;

    align-items: center;

    justify-content: center;

}

.column {

    float: left;

    width: 11%;

    padding: 5px;

  }

 

  /* Clearfix (clear floats) */

  .row::after {

    content: "";

    clear: both;

    display: table;

  }

main img{

    border-radius: 6px;

    border: .5px solid rgba(128, 128, 128, 0.301);

}

main img:hover{

    transition: .5s ease all;

    transform: scale(1.1);

}

@media screen and (min-width: 200px) and (max-width: 750px){

    .column{

        float: left;

        width: 33%;

        padding: 5px;

    }

}

Facebook - Modo Oscuro

 

Tema oscuro para aplicación de Facebook

Pasos que tienes que seguir para poderlo cambiar de claro hacía oscuro.

1. Accede a la app de Facebook.
2. Clic a las tres líneas
3. Configuración y Privacidad
4. Modo Oscuro
5. Activar...

Nieve - Gadget para tu sitio web con javascript

 

Nieve en tu sitio web con Javascript

Hay que tener este código:

var speed=30; // A menor numero más rápido

var flakes=150; // Numero de Copos de Nieve

var flake_image="http://i60.servimg.com/u/f60/13/20/23/83/sin_ta11.png"; // URL de la imagen de nieve

var swide, shigh;

var dx=new Array();

var xp=new Array();

var yp=new Array();

var am=new Array();

var sty=new Array();

window.onload=function() { if (document.getElementById) {

var k, f, b;

b=document.createElement("div");

b.style.position="absolute";

b.setAttribute("id", "bod");

document.body.appendChild(b);

set_scroll();

set_width();

for (var i=0; i<flakes; i++) {

dx[i]=0;

am[i]=Math.random()*20;

xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);

yp[i]=Math.random()*shigh;

sty[i]=0.75+1.25*Math.random();

f=document.createElement("div");

f.style.position="absolute";

f.setAttribute("id", "flk"+i);

f.style.zIndex=i;

f.style.top=yp[i]+"px";

f.style.left=xp[i]+"px";

k=document.createElement("img");

k.src=flake_image;

f.appendChild(k);

b.appendChild(f);

}

setInterval("winter_snow()", speed);

}}

window.onresize=set_width;

function set_width() {

if (document.documentElement && document.documentElement.clientWidth) {

swide=document.documentElement.clientWidth;

shigh=document.documentElement.clientHeight;

}

else if (typeof(self.innerHeight)=="number") {

swide=self.innerWidth;

shigh=self.innerHeight;

}

else if (document.body.clientWidth) {

swide=document.body.clientWidth;

shigh=document.body.clientHeight;

}

else {

swide=800;

shigh=600

}

}

window.onscroll=set_scroll;

function set_scroll() {

var sleft, sdown;

if (typeof(self.pageYOffset)=="number") {

sdown=self.pageYOffset;

sleft=self.pageXOffset;

}

else if (document.body.scrollTop || document.body.scrollLeft) {

sdown=document.body.scrollTop;

sleft=document.body.scrollLeft;

}

else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {

sleft=document.documentElement.scrollLeft;

sdown=document.documentElement.scrollTop;

}

else {

sdown=0;

sleft=0;

}

document.getElementById("bod").style.top=sdown+"px";

document.getElementById("bod").style.left=sleft+"px";

}

function winter_snow() {

for (var i=0; i<flakes; i++) {

yp[i]+=sty[i];

if (yp[i]>shigh-30) {

xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);

yp[i]=0;

sty[i]=0.75+1.25*Math.random();

}

dx[i]+=0.02+Math.random()/10;

document.getElementById("flk"+i).style.top=yp[i]+"px";

document.getElementById("flk"+i).style.left=(xp[i]+am[i]*Math.sin(dx[i]))+"px";

}

}

Decora tu sitio web con este Gadget para Navidad

Recuerden que el script puede estar dentro de HTML o en su propio archivo.JS

Cuando es la 1era vez que se agrega el código tarda en aparecer en el sitio web.

Windows - Ms Settings - Comandos para abrir las configuración en Windows

Comandos de Windows que si los utilizas como enlaces, abren las configuraciones que tienes en tu PC

ms-settings:

ms-settings:display

ms-settings:colors

ms-settings:system

ms-settings-connectabledevices:devicediscovery transferir a pantallas disponibles

ms-settings:nightlight luz nocturna

ms-settings:sound sonido

ms-settings:powersleep energia y bateria

ms-settings:storagesense almacenamiento

ms-settings:savelocations donde se guarda cada contenido

ms-settings:multitasking multitareas

ms-settings:bluetooth

ms-settings:network-wifi

ms-settings:personalization-background fondo de pantalla

Crear nuevo escritorio en Windows

 

Windows + Tab.

Ctrl + Win + D.

Javascript - Escuchar audio al presionar una imagen

CÓDIGO HTML

<button class="zorro">

    <img src="https://st4.depositphotos.com/155636red.jpg" alt="zorro" title="Zorro" >        

</button>

CODIGO CSS

let botonzorro = document.querySelector(".zorro")

botonzorro.addEventListener("click", () => {

    let etiquetaAudio = document.createElement("audio")

    etiquetaAudio.setAttribute("src", "../media/zorro.mp3")

    etiquetaAudio.play()

})

CMD - Comandos

INDICE PARA ACCEDER A LOS CÓDIGOS (CMD) MAS REGULARES.

Apagar sistema
Aplicaciones
Carpetas
Mantenimiento
Red
System
Tareas
Usuarios

CMD                          [Símbolo de sistema]

El símbolo del sistema (en inglés, Command prompt, también conocido como cmd.exe o simplemente cmd) es el intérprete de comandos en OS/2 y sistemas basados en Windows NT (incluyendo Windows 2000, Windows XP, Windows Server 2003, Windows Vista, Windows 7, Windows 8, Windows 8.1 y Windows 10). 

Es el equivalente de COMMAND.COM en MS-DOS y sistemas de la familia Windows 9x

Componentes PC gamer

samsung galaxy tab s7+
apple ipad pro

rom
ram

procesador: cerebro del ordenador, ejecucion de instrucciones de los programas.. nucleos e hilos
procesador es quien ayuda a la tarjeta grafica
procesador tiene que ser compatible con placa base: motherboard: 3formatos principales

atx: mas posibilidades y mas conexiones, ram usb mas capacidad overcloc
micro atx: montaje menor al convencional
mini atx: super pequeño pc

buscando
ryzen 5 3600 socket que socket tiene..? en google
the socket is am4

tarjeta grafica: datos para que provienen del procesador, transformarlos para imagen
necesita enfriamiento...

media baja tarjeta grafica 1080p
streaming: procesador y memoria ram. escoger componenetes de manera equilibrada

amd: ryzen 3, 5, 7 o 9 o intel: i3, 5, 7 o 9
mayor es el numero mayor gama alta es... se calienta y pide enfriamento
hay refrigreracion por aire o liquidas

aire: tipicos
liquidas: all in one circuito cerrado, el liquido se cambia cada cierto tiempo
liquidas modulares, son las que se montan en el cpu... son muy caras y las mejores (overcloc mejorar las frecuencias a las que trabajan los componentes de serie para ganar rendimiento generan mucho calor y piden enfriador)

ram: asistente del procesador
almacen de datos con los que se trabajan en el momento, varios programas abiertos al mismo tiempo
2dual chanel 8gb mejor que sea de 4 y 4

almacenamiento:
ssd m2 los rapdios
ssd rapido
hdd normal no se recomienda instalar app acá

kernel
bios

Paramount + | Como acceder a la plataforma de paramount plus con proveedor izzi

 

Accesa a tu cuenta Paramount +

Acá dejo los pasos para que puedas acceder a tu cuenta, ya que es difícil cuando se es nuevo con Paramount Plus

PASOS:

1. Ingresar a: Paramount +
2. Dar clic sobre "Ya tengo Paramount+"
3. Seleccionar: "Inicia sesion con proveedor"... Acceder con los datos de tu proveedor y no dar clic en "Log In", se abre sola la sesión y es ahi cuando ya te deja tener el acceso a la cuenta.
4. Si te deja acceder a ver contenido y no es tu usuario y contraseña, te recomiendo que la sigas usando así por el momento, ya que Paramount si tiene un error en ello.

Activar Paramount en tu decodificador

Twitter - Agregar cronología de Twitter en tu sitio web

Agregar cronología de Twitter en tu sitio web.

Esto es para poder ver el contenido de tus Twits en tu página web o tu blog...

Google - Donde encontrar el amlacenamiento de Google para borrar archivos y crear espacio

Google One

Cuando buscas el almacenamiento de Google para borrar archivos y crear espacio, tienes que acceder a Google One...

 

Fue un dolor de cabeza encontrar la ubicación pero la encontre.

Error - Pantalla morada en vídeos de Youtube

Corrección de pantalla morada al reproducir vídeo en Youtube.

Esta es una solución para cuando la imágen del vídeo se comienza a ver de color morado. Y esto sucede en todos los vídeos.

1. Configuración
2. Configuración Avanzada.
3. Sistema.
4. Utilizar aceleración por hardware cuando este disponible.

Grid - Primer código

HTML

    <div class="grid-container">

        <div class="item1" id="resumen">

            <a href="https://unsplash.com/es" id="enlace"></a>

        </div>

        <div class="item2">

            <a href="https://www.w3schools.com/js/js_intro.asp" id="enlace"></a>

        </div>

        <div class="item3">spidder</div>  

        <div class="item4">fissh</div>

        <div class="item5">birdds</div>

        <div class="item6">repptile</div>

        <div class="item7">innsect</div>

        <div class="item8">gusann</div>

       

      </div>

CSS

#enlace{

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 10;

  }

 

  .item1 { grid-area: mammif; position: relative;}

  .item2 { grid-area: star; position: relative;}

  .item3 { grid-area: spidder; }

  .item4 { grid-area: fissh; }

  .item5 { grid-area: birdds; }

  .item6 { grid-area: repptile; }

  .item7 { grid-area: innsect; }

  .item8 { grid-area: gusann; }

 

  .grid-container {

    display: grid;

    grid-template-areas:

      'mammif  star spidder '

      'mammif  fissh fissh '

      'birdds  birdds repptile '

      'innsect gusann repptile ';

    gap: 10px;

    padding: 10px;

    background-color: blue;

    height: 100vh;

  }

 

  .grid-container > div {

    background-color: rgb(255, 0, 0);

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

  }

  .grid-container > div:first-child{

    background-image: url(https://c.tenor.com/D0mMDlj9g8AAAAAd/wolf-love.gif);

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;  

  }

  .grid-container > div:nth-child(2){

    background-image: url(https://j.gifs.com/qj6g1y@small.gif);

    background-position: top;

    background-repeat: no-repeat;

    background-size: cover;  

  }

HTML - Enlace desde una caja (div)

Código para enlazar una div a un enlace.

HTML

    <div id="intro">

        <a href="https://mike-salinas.blogspot.com/" id="enlace"></a>

    </div>

 CSS

#enlace{

    position: absolute;

    width: 100%;

    height: 100%;

}

#intro{

    width: 200px;

    height: 200px;

    position: relative;

    background: red;

}

ROMS - Juegos para Project 64

 

Roms de juegos

Encuentra los mejores roms de juegos para tu pc

CONSOLAS

1. Nintendo
2. Super Nintendo
3. N64
4. Playstation
5. Playstation 2

JS - Mostrar y ocultar imagen

Un breve código para mostrar y ocultar imagenes o contenido con javascript

HTML

<button id="boton" onclick="mostrar();">Mostrar Imagen</button>

<button id="boton" onclick="ocultar();">Ocultar Imagen</button>

<div id="img">

  <img src="#" alt="">

</div>

CSS

#img{

    display: none;

}

JS

function mostrar(){

    document.getElementById('img').style.display = 'block';

}

function ocultar(){

    document.getElementById('img').style.display = 'none';

}

Animación Scroll JS - Mostrar al hacer scroll el contenido

Código 

HTML

class="animado"

CSS

/**************   ANIMACIONES   **************/

.animado{

    opacity: 0;

    transition: all .5s;

}

.mostrarArriba{

    animation: mostrarArriba 1s;

}

@keyframes mostrarArriba{

    0% {

        transform: translateY(60px);

    }

    100% {

        transform: translateY(0);

    }

}

JS

/********************* SCROLL ANIMADO *********************/

let animado = document.querySelectorAll(".animado");

function mostrarScroll (){

  let scrollTop = document.documentElement.scrollTop;

  for (var i = 0; i < animado.length; i++){

    let alturaAnimado = animado[i].offsetTop;

    if(alturaAnimado - 250 < scrollTop){

      animado[i].style.opacity = 1;

      animado[i].classList.add("mostrarArriba");

    }

  }

}

window.addEventListener('scroll', mostrarScroll)

CSS - Enlazar la hoja de estilos de una página hacia una carpeta

Código para enlazar la hoja de estilos de una carpeta hacia el archivo.

 href="../css/estilos2.css"

Menú - Links escondidos con media query

 HTML

    <header class="header">

        <div class="container logo-nav-container">

         

          <a href="" class="logo">

            <img src="img/mklogo.png" alt="">

          </a>

         

          <span class="menu-icon">

              <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Umbrella_Corporation_logo.svg/1024px-Umbrella_Corporation_logo.svg.png" alt="" height="45px" title="Clic aquí">            

            </span>

           

          <nav class="navigation">

            <ul>

              <li><a href="">Inicio</a></li>

              <li><a href="">Servicios</a></li>

              <li><a href="">Contacto</a></li>

              <li><a href="">Blog</a></li>

            </ul>

          </nav>

        </div>

      </header>

   

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <script src="#ruta de tu archivo"></script>

CSS

body{

    width: 100%;

    margin: 0%;

    padding: 0%;

    font-family: 'Varela Round', sans-serif;

    font-size: 15px;

    color: rgb(0, 0, 0);

    overflow: hidden;

}

/**************   HEADER   **************/

header{

    height: auto;

    color: white;

    left: 0;

    top: 0;

    right: 0;

    position: relative;

    z-index: 1;

}

.logo-nav-container{

    height: 120px;

    display: flex;

    flex-flow: wrap;

    align-items: center;

    justify-content: space-around;

    background-image: url(https://besthqwallpapers.com/Uploads/4-5-2019/90085/thumb2-gray-snake-skin-texture-cobra-skin-texture-creative-background-snake-skin-background.jpg);

    background-position: center;

    box-shadow: 4px 7px 21px -6px rgba(0,0,0,0.97);

    -webkit-box-shadow: 4px 7px 21px -6px rgba(0,0,0,0.97);

    -moz-box-shadow: 4px 7px 21px -6px rgba(0,0,0,0.97);

}

.logo{

    display: flex;

    align-items: center;

}

.logo img{

    height: 120px;

}

.menu-icon{

    display: none;

}

.navigation ul{

    margin: 0;

    padding: 0;

    list-style: none;    

}

.navigation ul li{

    display: inline-block;

}

.navigation ul li a{

    font-size: 1rem;

    text-transform: uppercase;

    display: block;

    padding: 0.5rem 1rem;

    transition: all 0.3s linear;

    text-decoration: none;

    color: rgb(255, 255, 255);

    border-bottom: 2px solid transparent;

}

.navigation ul li a:hover{

    color: rgb(226, 226, 226);

    border-bottom: 2px solid white;

}

/**************** MEDIA QUERY ****************/

@media (min-width: 200px) and (max-width: 600px){

    

    .logo-nav-container{

        height: auto;

    }    

    .logo img{

        height: 80px;

    }

    .menu-icon{

        display: block;

        cursor: pointer;

    }

    .menu-icon img{

        height: 80px;

        border: 2px solid rgb(84, 255, 4);

        border-radius: 100%;

        margin: 10px 0px;

    }

    .navigation {

        width: 100%;

        clear: "";

        background: rgba(0, 0, 0, 0.39);

    }

    .navigation ul{

        display: none;

    }

    .navigation ul.show{

        display: block;

    }

    .navigation ul li{

        display: block;

    }

    .navigation ul li a{

        display: block;

        transition: .3s all linear;

        text-align: center;

    }

    .navigation ul li a:hover{

        color: rgb(0, 177, 9);

        background: rgb(255, 255, 255);

    }    

}

JS

jQuery('document').ready(function($){

    var menuBtn = $('.menu-icon'),

        menu = $('.navigation ul');

        menuBtn.click(function(){

            if (menu.hasClass('show')){

                menu.removeClass('show');

            }else {

                menu.addClass('show');

            }

        });

});