In urmatorul tutorial veti invata cum sa animati fundalul headerului exact ca pe urmatorul forum de teste: http://testephpbb2fd.forumgratuit.ro/
Sunt cativa pasi simpli, pe care oricine ii poate face. Sa trecem la treaba!
Mai intai trebuie sa punem ca si fundal headerului o imagine care se poate repeta. Eu am sa folosesc imaginea urmatoare: https://2img.net/h/oi44.tinypic.com/240x16v.jpg
Mergem in PA - Afisare - Culori - Foaia de stil CSS si introducem urmatorul cod:
Acum ca am pus background headerului, hai sa il animam.
Mergem in PA - Module - Jestiunea codurilor javascript
Asigura-te ca ai activat gestiunea codurilor javascript
Apoi creaza un nou fisier javascript cu amplasare in toate paginile, cu titlul "background animat", si introduceti codul urmator, apoi valideaza-l.
Am terminat!
Codul de mai sus va anima backgroundul a.i sa se deruleze pe orizontal. Daca vrei sa se deruleze pe vertical, in codul js inlocuieste
cu
Codurile de mai sus sunt pentru versiunea PunBB.
Daca forumul tau este pe PhpBB3, atunci va trebui sa inlocuiesti atat in codul css, cat si in codul js
cu
.
Sper ca ti-a fost de ajutor :)
Lasa-ne un feed-back.
Ultima editare efectuata de catre REDLINE in Dum Noi 24, 2013 6:47 pm, editata de 1 ori
Sunt cativa pasi simpli, pe care oricine ii poate face. Sa trecem la treaba!
Mai intai trebuie sa punem ca si fundal headerului o imagine care se poate repeta. Eu am sa folosesc imaginea urmatoare: https://2img.net/h/oi44.tinypic.com/240x16v.jpg
Mergem in PA - Afisare - Culori - Foaia de stil CSS si introducem urmatorul cod:
Cod:
#pun-intro{
background: url(http://i44.tinypic.com/240x16v.jpg) repeat;
}
Mergem in PA - Module - Jestiunea codurilor javascript
Asigura-te ca ai activat gestiunea codurilor javascript
Apoi creaza un nou fisier javascript cu amplasare in toate paginile, cu titlul "background animat", si introduceti codul urmator, apoi valideaza-l.
Cod:
$(document).ready(function () {
setInterval(function() {
$('#pun-intro').animate({
'background-position-x' : '+=2'
}, 100)
}, 100)
});
Am terminat!
Codul de mai sus va anima backgroundul a.i sa se deruleze pe orizontal. Daca vrei sa se deruleze pe vertical, in codul js inlocuieste
Cod:
'background-position-x' : '+=2'
Cod:
'background-position-y' : '+=2'
Daca forumul tau este pe PhpBB3, atunci va trebui sa inlocuiesti atat in codul css, cat si in codul js
Cod:
#pun-intro
Cod:
.headerbar
Sper ca ti-a fost de ajutor :)
Lasa-ne un feed-back.
Ultima editare efectuata de catre REDLINE in Dum Noi 24, 2013 6:47 pm, editata de 1 ori