ArtigosWidget Top 5 Galeria
2 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Widget Top 5 Galeria
por YouTube3 23.07.16 14:04
Detalhes da questão
Endereço do fórum: http://BestCode.Forumeiros.com
Versão do fórum: PunBB
Descrição
Bom, tava sem nada para fazer quando entrei em um fórum me deparei com um Widget Top 5 Galerias, gostei bastante dele.
Queria saber como faço para por no meu fórum.
Widget Top 5 Galerias: https://i.imgur.com/GOzFR9x.jpg
Fórum onde vi: http://suportedesign.forumeiros.com/
Até mais.
Última edição por YouTube3 em 23.07.16 20:11, editado 2 vez(es)
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 15:24
Olá autor,
crie um widget personalizado com o seguinte código:
Atenciosamente.
Luig
crie um widget personalizado com o seguinte código:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style>
<script>var counts = 5;
img1 = new Image();
img1.src = 'URL DA IMAGEM';
img2 = new Image();
img2.src = 'URL DA IMAGEM';
img3 = new Image();
img3.src = 'URL DA IMAGEM';
img4 = new Image();
img4.src = 'URL DA IMAGEM';
img5 = new Image();
img5.src = 'URL DA IMAGEM';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'ENDEREÇO 1';
url2 = 'ENDEREÇO 2';
url3 = 'ENDEREÇO 3';
url4 = 'ENDEREÇO 4 ';
url5 = 'ENDEREÇO 5';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Atenciosamente.
Luig
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 15:52
Opá,
Notei um erro que não tinha visto, se você for ver direitinho a imagem da galeria ta mais pra direita bem mais.
Eu quero deixar ela bem centralizada como da imagem.
Está assim:
Quero que fique assim:
Até mais.
#Edit
Notei um erro que não tinha visto, se você for ver direitinho a imagem da galeria ta mais pra direita bem mais.
Eu quero deixar ela bem centralizada como da imagem.
Está assim:
Quero que fique assim:
Até mais.
#Edit
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 17:44
Saudações!
poderia mim passa o seu código já editado?
Até mais.
poderia mim passa o seu código já editado?
Até mais.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 17:48
Opá,
Aqui está:
Aqui está:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 17:52
Olá,
troque por está:
Até mais.
troque por está:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px;margin-left:-8px}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style>
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Até mais.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 18:12
Sem resultado apenas bugou: https://i.imgur.com/xUV16nS.jpg
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 18:20
Olá!
troque por este:
Resulta?
Até.
troque por este:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px;margin-left:-8px;}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Resulta?
Até.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 18:29
Apenas um detalhe centralizo porem a imagem fico tampando a linha do widget se for ver bem olhe.
print: https://i.imgur.com/zdiRHNi.jpg do lado direito a linha do widget ta certinha porem desse lado fico bugada a imagem fico encima.
print: https://i.imgur.com/zdiRHNi.jpg do lado direito a linha do widget ta certinha porem desse lado fico bugada a imagem fico encima.
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 18:37
Boa tarde,
altera o código para este:
altera o código para este:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px;margin-left:-8px;margin-right:3px!important;}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 18:39
Boa tarde sem resultado, pode da um descanço ae rs sem pressa. 
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 18:40
Olá,
kk nada isso é simples, troque novamente por este;
Até mais.
kk nada isso é simples, troque novamente por este;
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px;margin-left:-3px;}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:180px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Até mais.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 19:18
Ish deu ruim kk agora desbugo esse lado e bugo o outro rs sera que não e a imagem que e muito grande? qualquer coisa eu irei trocar para ver.
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 19:27
Olá,
fiz uma alteração nos códigos como larguras e posição, tente este:
Até mais.
fiz uma alteração nos códigos como larguras e posição, tente este:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:140px;height:135px;margin-left:25px;}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:140px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:60px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Até mais.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Re: Widget Top 5 Galeria
por YouTube3 23.07.16 19:44
Opá,
Um pequeno bug os números fico um embaixo do outro se você ver e fico um pouco pro lado direito só falto centralizar novamente e botar os números um do lado do outro. Print: https://i.imgur.com/wlIYmO8.jpg
Um pequeno bug os números fico um embaixo do outro se você ver e fico um pouco pro lado direito só falto centralizar novamente e botar os números um do lado do outro. Print: https://i.imgur.com/wlIYmO8.jpg
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 19:57
Olá,
cá está:
Até mais.
cá está:
- Código:
<style>.picshow{z-index:444;position:relative;background-color:#ffffff;width:100%;height:135px}.picshow_main{position:relative;width:180px;height:135px;margin-left:13px;}.picshow_main .imgbig{filter:progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4,motion=forward);width:140px;height:135px}.picshow_change{position:absolute;text-align:left;bottom:0px;height:30px;right:5px;left:20px}.picshow_change img{width:15px;height:15px}.picshow_change a{border:1px solid;display:block;float:left;margin-right:5px;-display:inline}a.axx{border-color:#555}a.axx:hover{border-color:#000}a.axx img{filter:alpha(opacity=40);opacity:0.4;-moz-opacity:0.4}a.axx:hover img{filter:alpha(opacity=100);opacity:1.0;-moz-opacity:1.0}a.bxx{border-color:#000}a.bxx:hover{border-color:#000}img{border:0px}</style><script>var counts = 5;
img1 = new Image();
img1.src = 'http://i.imgur.com/8SWac0r.png';
img2 = new Image();
img2.src = 'http://i.imgur.com/qfGU1xd.png';
img3 = new Image();
img3.src = 'http://i.imgur.com/ApNuR6X.png';
img4 = new Image();
img4.src = 'http://i.imgur.com/Le2TsJd.png';
img5 = new Image();
img5.src = 'http://i.imgur.com/hhb4PuM.png';
var smallImg = new Array();
smallImg[0] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton1.gif';
smallImg[1] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton2.gif';
smallImg[2] = 'http://2img.net/i/fa/optimisation_fdf/common/bouton3.gif';
smallImg[3] = 'http://i.imgur.com/j9q7B.png';
smallImg[4] = 'http://i.imgur.com/mzFKQ.png';
url1 = 'http://i.imgur.com/8SWac0r.png';
url2 = 'http://i.imgur.com/qfGU1xd.png';
url3 = 'http://i.imgur.com/ApNuR6X.png';
url4 = 'http://i.imgur.com/Le2TsJd.png';
url5 = 'http://i.imgur.com/hhb4PuM.png';
alt1 = new Image();
alt1.alt = 'Clique e confira!';
alt2 = new Image();
alt2.alt = 'Clique e confira!';
alt3 = new Image();
alt3.alt = 'Clique e confira!';
alt4 = new Image();
alt4.alt = 'Clique e confira!';
alt5 = new Image();
alt5.alt = 'Clique e confira!';
var nn = 1;
var key = 0;
function change_img() {
if (key == 0) {
key = 1;
} else if (document.all) {
document.getElementById("pic").filters[0].Apply();
document.getElementById("pic").filters[0].Play(duration = 2);
}
eval('document.getElementById("pic").src=img' + nn + '.src');
eval('document.getElementById("url_theme").href=url' + nn);
eval('document.getElementById("pic").alt=alt' + nn + '.alt');
if (nn == 1) {
document.getElementById("url_theme").target = "_blank";
document.getElementById("url_theme").style.cursor = "pointer";
} else {
document.getElementById("url_theme").target = "_blank"
document.getElementById("url_theme").style.cursor = "pointer"
}
for ( var i = 1; i <= counts; i++) {
document.getElementById("xxjdjj" + i).className = 'axx';
}
document.getElementById("xxjdjj" + nn).className = 'bxx';
nn++;
if (nn > counts) {
nn = 1;
}
tt = setTimeout('change_img()', 4000);
}
function changeimg(n) {
nn = n;
window.clearInterval(tt);
change_img();
}
function ImageShow() {
document.write('<div class="picshow_main">');
document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
document.write('<div class="picshow_change">');
for ( var i = 0; i < counts; i++) {
document.write('<a href="javascript:changeimg(' + (i + 1)
+ ');" id="xxjdjj' + (i + 1)
+ '" class="axx" target="_self"><img src="' + smallImg[i]
+ '"></a>');
}
document.write('</div></div>');
change_img();
}</script><script>ImageShow()</script>
Até mais.
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
YouTube3- Super Membro
- Membro desde : 04/01/2015
Mensagens : 1120
Pontos : 1597 -
Re: Widget Top 5 Galeria
por REVIEW 23.07.16 20:20
 | Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas". |
REVIEW- Super Membro
- Membro desde : 30/12/2014
Mensagens : 1190
Pontos : 2285 -
Tópicos semelhantes» APARENCIA DO WIDGET GALERIA.
» Widget Galeria de fotos
» [Dúvida] Galeria Publica e Galeria Inserir galeria no menu do fórum
» Widget da galeria não é modificável pelo painel de controle
» [FAQ] Gerir a galeria do fórum
» Widget Galeria de fotos
» [Dúvida] Galeria Publica e Galeria Inserir galeria no menu do fórum
» Widget da galeria não é modificável pelo painel de controle
» [FAQ] Gerir a galeria do fórum
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos