Navigare rapidă

Ultimele subiecte
» Generator coduri html pentru culori
Scris de Tibi16 Mier 19 Apr - 16:04
» Bine v-am gasit !
Scris de Joker#King Mier 12 Apr - 12:50
» Summer v1.1 theme
Scris de MihaiExtremTutorials Mier 5 Apr - 2:44
Cuvinte-cheie

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

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