Galeria de Iconos

grojaspineda · #1 (**permalink**) 15/07/2014, 12:36

Hola,

Quería saber si han visto por la web, alguna galería de iconos, la cosa es que estoy tratando de hace una especie de circulo con los iconos donde solo se vea la mitad como en forma de semi-luna, entonce cuando el usuario pase el mouse, este se va moviendo.

Igual es es la primera idea que tenia, pero si alguno encontró alguna otra, seria de gran ayuda si me la compartieran.

pzin · #2 (**permalink**) 15/07/2014, 13:26

Bienvenido al foro.

Yo suelo usar iconmonstr, que por lo general cubre las necesidades de una web.

Triby2 · #3 (**permalink**) 15/07/2014, 18:41

Cita:

Iniciado por grojaspineda

Hola,

Quería saber si han visto por la web, alguna galería de iconos, la cosa es que estoy tratando de hace una especie de circulo con los iconos donde solo se vea la mitad como en forma de semi-luna, entonce cuando el usuario pase el mouse, este se va moviendo.

Igual es es la primera idea que tenia, pero si alguno encontró alguna otra, seria de gran ayuda si me la compartieran.

Sería menos tedioso para la carga de la web que para cosas así utilizes CSS.

Ejemplo:

En el body de tu html pones

Código HTML:

Ver original<div id="semi_circulo"></div>

y entre <head></head> escribe el estilo:

Código HTML:

Ver original<style>
.semi_circulo {
    background-color: blue;
    height: 50px;
    width: 25px;
    border-radius: 0 75px 75px 0;
        transition-duration: 0.3s;
}
</style>

El resultado será un semi circulo de color azul.

Si quieres que se vaya moviendo cuando pases el ratón por encima tienes que escribir otro estilo que se llame igual pero terminado en ":hover" y ahí ponerle lo que quieras cuando pases el ratón por encima.

Añade entre <style></style> lo siguiente:

Código CSS:

Ver original.semi_circulo:hover {
    background-color: red;
    height: 75px;
    width: 50px;
    border-radius: 0 75px 75px 0;
        transition-duration: 0.3s;
}

En este ejemplo solo cambia el tamaño y color de manera animada. Pruébalo y me dices si te gusta de esa manera en vez de utilizar imágenes para dibujos sencillos.

grojaspineda · #4 (**permalink**) 20/07/2014, 15:30

Hola Compañeros gracias por responder.

probe el que me dijiste Triby2 pero no me funciono,

mas que todo lo que busco es una galeria de imagenes pero para poner unos iconos,
buscaba que fuera en semicirculo, creo que es algo dificil y no encontre mucho en la web por eso vine aqui.

la idea es poner los lenguajes de programacion y tecnologuias que manejo pero solo el logo.

gracias.