Navigare rapidă

Ultimele subiecte
» Criptare sursa html in cifre
Scris de nicutzy Joi 23 Mar - 2:09
» Bine v-am gasit !
Scris de Andrei34 Mier 22 Mar - 15:19
» Cum retusam imaginile
Scris de razvan112 Vin 17 Mar - 15:00
Cuvinte-cheie

edit  drop  tema  html  Metin2  profil  tutorial  animate  menu  legenda  cautare  meniu  chenar  Bara  avatar  ultimele  banner  reclama  subforumuri  radio  phpBB2  navigare  Mesaje  punbb  pentru  Statistici  

JQUERY - Schimbare iconuri la butoanele BBCode


Buna ziua tuturor,

In tutorialul de astazi am sa va arat cum puteti schimba un icon anume de la butoanele BBCode. Mai jos se afla o imagine pentru a va da seama despre ce este vorba.
[Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine]
Imaginile de mai jos pot fi schimbate foarte usor. Pentru a inlocui imaginea trebuie sa adaugati un alt icon (16x16px) in locul celei existente.
Iconuri actuale:
[Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine][Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine]
Link-uri imaginia actuale:
Cod:
http://illiweb.com/fa/wysiwyg/text_bold.png
http://illiweb.com/fa/wysiwyg/text_italic.png
http://illiweb.com/fa/wysiwyg/text_underline.png
http://illiweb.com/fa/wysiwyg/text_strikethrough.png
http://illiweb.com/fa/wysiwyg/text_align_center.png
http://illiweb.com/fa/wysiwyg/text_align_left.png
http://illiweb.com/fa/wysiwyg/text_align_right.png
http://illiweb.com/fa/wysiwyg/page_white_code.png
http://illiweb.com/fa/i/smiles/icon_smile.gif
http://illiweb.com/fa/wysiwyg/color_swatch.png
http://illiweb.com/fa/wysiwyg/help.png
http://illiweb.com/fa/wysiwyg/link.png
http://illiweb.com/fa/wysiwyg/film.png
http://illiweb.com/fa/wysiwyg/text_list_numbers.png
http://illiweb.com/fa/wysiwyg/picture.png
http://illiweb.com/fa/wysiwyg/comments.png
http://illiweb.com/fa/wysiwyg/text_list_bullets.png
http://illiweb.com/fa/wysiwyg/text_align_justify.png
http://illiweb.com/fa/wysiwyg/text_horizontalrule.png
http://illiweb.com/fa/wysiwyg/table.png
http://illiweb.com/fa/wysiwyg/picture_save.png
http://illiweb.com/fa/wysiwyg/page_white_flash.png
http://illiweb.com/fa/wysiwyg/style.png
http://illiweb.com/fa/wysiwyg/font.png
http://illiweb.com/fa/wysiwyg/separator.png
Pentru a schima un icon adaugati in felul urmator.

P.A=>Module=>Portal & Widget-uri=>Gestionarea Widget-urilor forumului=>Creati un widget personalizat
Adaugati acest cod pentru al putea edita:
Cod:
<script type="text/javascript">

jQuery(document).ready(function() {
    jQuery('button img').each(function() {
/*------------CODURI ICONURI------------------*/
        if(jQuery(this).attr('src') == 'IMAGINE ACTUALA') jQuery(this).attr('src', 'IMAGINE NOUA');
/*------------CODURI ICONURI TERMINAT------------------*/
    });
})
</script>

Unde este notat IMAGINE ACTUALA stergeti si adaugati una din iconurile de mai sus. Pentru IMAGINE NOUA adaugati dupa propriile preferinte un icon de 16x16pixeli.

Daca doriti sa schimbati mai multe iconuri adaugati deasupra /*------------CODURI ICONURI TERMINAT------------------*/ urmatorul cod:
Cod:
        if(jQuery(this).attr('src') == 'IMAGINE ACTUALA') jQuery(this).attr('src', 'IMAGINE NOUA');
Daca doriti de exemplu sa modificati 6 iconuri atunci adaugati acest cod de 6 ori. Dar nu uitati ca trebuie sa modificati spatiile "IMAGINE ACTUALA" si "IMAGINE NOUA".
Sper ca veti reusi sa realizati ceea ce am prezentat in acest tutorial.

Comentariile utilizatorilor
Membru dedicat
avatar
la data de Joi 6 Oct - 9:05
Mitză Membru dedicat
Conectat
Mersi mult Stefan, cat am cautat ca sa pot face asta la phpBB3 !
Membru dedicat
avatar
la data de Joi 6 Oct - 12:58
Paul Membru dedicat
Conectat
Multumim mult pentru acest cod..
chiar il cautam de mult timp
Membru ET
avatar
la data de Dum 9 Oct - 15:05
[x]sTyL[e] Membru ET
Conectat
Frumos tutorial , multumim de coduri.
Vizitator
avatar
la data de Vin 14 Oct - 23:30
Vizitato Vizitator
Conectat
Adevarul e ca multi cautam candva acest cod, forumurile ce aveau alte similies nu stiau cum sa isi schimbe iconita de butonul BB.
Membru ET
avatar
la data de Sam 22 Oct - 19:09
denisdeni22 Membru ET
Conectat
Multumes Stefan.Este foarte folositor codul.
Membru ET
avatar
la data de Lun 24 Oct - 19:42
daniel_clv97 Membru ET
Conectat
multumesc pentru cod
Vizitator
avatar
la data de Dum 27 Noi - 19:21
Vizitato Vizitator
Conectat
Chiar cautam acest cod..vazuzem imaginile schimbate pe multe forumuri..
Membru nou
avatar
la data de Sam 31 Dec - 13:25
Banjo Membru nou
Conectat
Bun Tutorial dar mie numi iese
Membru ET
avatar
la data de Joi 5 Ian - 16:18
Emanuel Membru ET
Conectat
JQUERY - Schimbare iconuri la butoanele BBCode
Defapt nu functioneaza doar sa schimbi iconitele bbcode , merge sa schimbi ori ce fel de imagini.
Admin & Dezvoltator
avatar
la data de Joi 5 Ian - 17:15
Zeus Admin & Dezvoltator
Conectat
[Trebuie sa fiti inscris si conectat pentru a vedea acest link] a scris:
JQUERY - Schimbare iconuri la butoanele BBCode
Defapt nu functioneaza doar sa schimbi iconitele bbcode , merge sa schimbi ori ce fel de imagini.

Fiecare face ce vrea cu codul.
Vizitator
avatar
la data de Joi 5 Ian - 22:01
Vizitato Vizitator
Conectat
Totul depinde de selectori... jQuery('button img')
Membru activ
avatar
la data de Vin 6 Ian - 16:24
Mr.Crazy Membru activ
Conectat
Foarte folositor...aveam nevoie