fraNNNta-Design

Bine a-ti venit pe fraNNNta-Design
conectarecreaza cont



Inlocuirea imaginilor cu text

Distribuiţi
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Dum Sept 06, 2015 10:03 am

Cum spune si titlul as vrea sa pun un text, nu o imagine ca si aici:
[Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]
Dupa cum vedeti la citeaza,editeaza,sterge,ip, subiect nou, raspunde si subiect inchis are ce imi doresc si eu.





P.S: Pentru versiunea phpbb2.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Dum Sept 06, 2015 8:21 pm

Folosind acest cod de inlocuire a imaginilor.
Cod:

document.addEventListener("DOMContentLoaded", function() {

$("img[src='link imagine']").replaceWith('<span class="buton">nume buton</span>');



});

La link imagine pui link de la imaginea pe care o vrei inlocuita.
La nume buton inlocuiesti cu ce text vrei sa apara

Apoi in css adaugi acest cod
Cod:

span.buton{
color: black;
background: #111;
padding: 4px 6px;
border-radius: 3px;
}


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Lun Sept 07, 2015 9:27 am

Merge dar uite cum se vede:
[Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]
Si inca ceva cum pot adauga un efect hover la butoane?



P.S: As vrea si la Previzualizeaza, trimite, conectare si Inregistreaza-te.


Ultima editare efectuata de catre First Time in Mar Sept 08, 2015 10:45 am, editata de 1 ori


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Lun Sept 07, 2015 10:34 am

Mai intai rezolvam butoanele acestea apoi pe celelalte.
Mai adaugati ceva in plus in acel cod css de buton:
Cod:

display: inline-block!important;
float: left;
text-align: center;
min-width: 110px;
margin: 1px!important;
}


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Lun Sept 07, 2015 11:05 am

Nu s-a schimbat nimic.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Lun Sept 07, 2015 1:58 pm

Postati aici link cu forumul dumneavoastra si un cont oarecare


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Mar Sept 08, 2015 9:59 am

Vii le-am lasat pe toate in pm.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Mar Sept 08, 2015 9:21 pm

Incercati acest cod.
Cod:

span.buton {
    background: #0c6c99;
    border-radius: 4px;
    color: #fff;
display: inline-block!important;
font-size: 12px!important;
text-shadow: 0px -1px 1px #333;
width: 100px;
text-align: center;
padding: 4px 0px;
}



Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Mier Sept 09, 2015 10:49 am

Bun acel cod merge.
Dar as putea lasa unpic de spatiu intre butoane?
[Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]
Si cum as putea sa fac Subiect inchis rosu?


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
just.m1ky OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 934
Inscris : 01/09/2012

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de just.m1ky la data de Mier Sept 09, 2015 12:01 pm

Deci pentru spatiu intre ele adaugati la codul care vi l-a dat franta
Cod:


span.buton {
    background: #0c6c99;
    border-radius: 4px;
    color: #fff;
display: inline-block!important;
font-size: 12px!important;
text-shadow: 0px -1px 1px #333;
width: 100px;
text-align: center;
padding: 4px 0px;
}

dupa padding: 4px 0px;
margin-left: 2px;
margin-right: 2px;

Iar pentru alta culoare folositi acelasi script js numai ca ii schimbati clasa
Cod:

document.addEventListener("DOMContentLoaded", function() {

$("img[src='link imagine']").replaceWith('<span class="buton_blocat">nume buton</span>');



});

Acum in css aveti clasa span.buton_blocat (pentru blocat) cu aceleasi setari,trebuie sa schimbati doar culoarea de fundal.

Cod:

span.buton_blocat{
    background: #culoare;
    border-radius: 4px;
    color: #fff;
display: inline-block!important;
font-size: 12px!important;
text-shadow: 0px -1px 1px #333;
width: 100px;
text-align: center;
padding: 4px 0px;
}


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Sam Sept 12, 2015 11:02 am

Merge, dar mai sunt Citeaza,Editeaza, Sterge, IP, Trimite, Previzualizeaza.
Si as vrea un efect hover la toate.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Sam Sept 12, 2015 12:06 pm

Aplici acelasi cod javascript si pot inlocuii mai multe imagini cu un singur cod asa:

Cod:

document.addEventListener("DOMContentLoaded", function() {

$("img[src='link imagine']").replaceWith('<span class="butoane">nume buton</span>');
$("img[src='link imagine']").replaceWith('<span class="butoane">nume buton</span>');
$("img[src='link imagine']").replaceWith('<span class="butoane">nume buton</span>');
$("img[src='link imagine']").replaceWith('<span class="butoane">nume buton</span>');
$("img[src='link imagine']").replaceWith('<span class="butoane">nume buton</span>');



});


Apoi in css

Cod:

.butoane{
    background: #culoare;
    border-radius: 3px;
display: inline-block!important;
font-size: 12px!important;
text-shadow: 0px -1px 1px #333;
width: 65px;
text-align: center;
padding: 4px 0px;
float: right;
}

si cu hover{

Cod:


.butoane:hover{
background: #culoare;
}


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
First Time OnlineOffline
avatar
Rank: Membru
Respect : 100%
Mesaje : 109
Inscris : 03/08/2013

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de First Time la data de Sam Sept 12, 2015 1:23 pm

Merge bine, dar nu imi apare efectul si la celelalte butoane(ma refer la Subiect nou, Comenteaza si Subiect inchis).




P.S: Am rezolvat singur aceasta problema.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3974
Inscris : 18/06/2011

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de mr.franta la data de Sam Sept 12, 2015 2:22 pm

Pot sa inchid acest subiect?


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
Continut sponsorizat OnlineOffline

biggri Re: Inlocuirea imaginilor cu text

Mesaj Scris de Continut sponsorizat



Sus

    Acum este: Vin Iul 20, 2018 8:08 am