[Tutorial] Opções na imagem (Ver em tamanho real,Baixar imagem)

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Admin
Admin
Administrador
Tempo Online : 250d 6h 21m 59s
Mensagens : 693
Reputação : 4
https://bestweb.forumeiro.com

MensagemAdmin Seg Out 03, 2016 8:07 pm

Informações:
Autor:
While
Funcionalidade: Todas as versões




Acesse:
Painel de Controle Modulos Html e Javascript Gestão dos codigos Javascript
E Crie um novo Javascript com investimento em todas as paginas com esse código:
Código:
(function(){window.fa_img_resizer={max_width:400,max_height:250,selector:'.postbody > div:not(.user):not(.postprofile) img, .mod_news img, .message-text img',options:{bar:true,toggler:true,full_size:true,download:true,lightbox:true},lang:{full_size:'<i class="fa fa-external-link"></i> Ver em tamanho real',enlarge:'<i class="fa fa-search-plus"></i> Aumentar imagem',reduce:'<i class="fa fa-search-minus"></i> Reduzir a imagem',download:'<i class="fa fa-download"></i> Baixar imagem',tooltip:'Clique para ver a imagem no tamanho real'},resize:function(){for(var a=$(fa_img_resizer.selector),i=0,j=a.length;i<j;i++){if(!a[i].alt&&(a[i].naturalWidth>fa_img_resizer.max_width||a[i].naturalHeight>fa_img_resizer.max_height)){a[i].className+=' fa_img_reduced';if(fa_img_resizer.options.lightbox&&a[i].parentNode.tagName!='A'){a[i].style.cursor='pointer';a[i].title=fa_img_resizer.lang.tooltip;a[i].onclick=function(){fa_img_resizer.lightbox(this)}}if(fa_img_resizer.options.bar){(a[i].parentNode.tagName=='A'?a[i].parentNode:a[i]).insertAdjacentHTML('beforebegin','<div class="fa_img_resizer" style="width:'+(a[i].width-8)+'px;">'+(fa_img_resizer.options.toggler?'<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">'+fa_img_resizer.lang.enlarge+'</a>':'')+(fa_img_resizer.options.full_size?'<a class="fa_img_full" href="/viewimage.forum?u='+a[i].src+'" target="_blank">'+fa_img_resizer.lang.full_size+'</a>':'')+(fa_img_resizer.options.download&&!/Firefox/.test(navigator.userAgent)&&'download'in document.createElement('A')?'<a class="fa_img_download" href="'+a[i].src+'" target="_blank" download>'+fa_img_resizer.lang.download+'</a>':'')+'</div>')}}}},toggle:function(that){var img=that.parentNode.nextSibling;if(img.tagName=='A'){img=img.getElementsByTagName('IMG')[0]}if(/fa_img_reduced/.test(img.className)){that.innerHTML=fa_img_resizer.lang.reduce;that.className='fa_img_reduce';img.className=img.className.replace(/fa_img_reduced/,'fa_img_enlarged')}else{that.innerHTML=fa_img_resizer.lang.enlarge;that.className='fa_img_enlarge';img.className=img.className.replace(/fa_img_enlarged/,'fa_img_reduced')}that.parentNode.style.width=img.width-8+'px'},lightbox:function(that){var frag=document.createDocumentFragment(),overlay=$('<div id="fa_img_lb_overlay" />')[0],img=$('<img id="fa_img_lb_image" src="'+that.src+'" />')[0];overlay.onclick=fa_img_resizer.kill_lightbox;img.onclick=fa_img_resizer.kill_lightbox;frag.appendChild(overlay);frag.appendChild(img);document.body.appendChild(frag);document.body.style.overflow='hidden';img.style.marginTop='-'+(img.height/2)+'px';img.style.marginLeft='-'+(img.width/2)+'px'},kill_lightbox:function(){var overlay=document.getElementById('fa_img_lb_overlay'),img=document.getElementById('fa_img_lb_image');overlay&&document.body.removeChild(overlay);img&&document.body.removeChild(img);document.body.style.overflow=''}};document.write('<style type="text/css">'+fa_img_resizer.selector+', .fa_img_reduced { max-width:'+fa_img_resizer.max_width+'px; max-height:'+fa_img_resizer.max_height+'px; }'+'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+'.fa_img_resizer a { margin:0 3px; }'+'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+'</style>'+(!$('link[href$="font-awesome.min.css"]')[0]?'<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />':''));$(window).load(fa_img_resizer.resize);if(window.resize_images){window.resize_images=function(){return false}}}())

Resultado pode ser visto no fórum do Best Web.

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

Cria uma conta ou logue para postar uma mensagem.

Você precisa ser um membro, para poder postar uma resposta.

Criar conta

Participe de nossa comunidade, basta se registrar. É Fácil!


Criar uma conta

Logar

Já tem uma conta? Sem problemas, Logue agora.


Logar-se

 
Permissões neste sub-fórum
Não podes responder a tópicos