-
Efect Rotire?
Vreau sa creeez un efect de rotire/intoarcere/cum vreti sa-i spuneti.
Adica ceva de genul:
Am o caseta cu ceva text, o imagine si background. Vreau sa pun in colt un buton de "flip". Cand userul pasa pe acest buton caseta se roteste in plan orizontal si se intoarce cu spatele, unde sunt alte optiuni suplimentare ale respectivei inregistrari.
Ma intereseaza cum fac respectivul efect de rotire. Prin css, javascript/ajax? Accept orice sugestii si indicatii :D, macar un punct de pornire in cautarile mele.
PS: nu pot folosi flash :(
-
Daca as fi in locul tau, as face in felul urmator:
1. caseta cu poza si background intr-un layer
2. deasupra un alt layer (ascuns la inceput)
3. cand cineva da click pe flip, primul layer devine invizibil si al doilea vizibil si incarci in al doilea un gif animat cu efectul pe care il doresti tu
Cred ca se poate obtine usor cu javascript, cu conditia sa reusesti sa faci gif-ul ala animat intr-un program
-
La ceva de genul asta lucram acum. Am obtinut un gif animat destul de realist.
Problema e alta. Am 100 de inregistrari diferite la care ar trebui sa aplic efectul. asa ca intai trebuie sa blurez continutul casetei in timpul rotirii, sa nu se observe ca rotesc o caseta goala.
Si alta problema e ca gif-ul cu rotirea are 50 de kilo asa ca o sa crape browserul cu 100x50kb pe pagina.
-
Imaginea poate fi incarcata dinamic, numai cand userul da click pe flip.
ceva in genul asta:
Cod:
function loadImage()
{
document.getElementById('Div-ul tau').innerHTML = "<img src=imagine.gif />
}
si apelezi functia asta in evenimentul onclick la text (sau chiar in href la link)
