[TUTORIAL] Editar Rápido

Editar Rápido

Este efeito vai permitir ao clicar na imagem de Editar no tópico vai abrir um pequeno aba a perguntar se deseja Editar Rápido ou Editar Normal.

--> Versão <--
Funcional para todas Versões

1º) Criar um JavaScript:
Primeiro terá que criar uma página javascritp, Painel de controle » Módulos » HTML & JavaScritp » Gestão de códigos JavaScritp » Criar uma página de JavaScritp o Investimento marque Tópicos, coloque o código

Código:

$(function(){
$('head').append('<style>#locsdeidit [name="subject"], #locsdeidit [name="topic_color"]{display:none}#locsdeidit textarea{width: 70% !important;height: 900px !important;}#locsdeidit input:hover{background:rgba(200,200,200,0.2)}#locsdeidit input{margin-bottom:1%;margin-top:1%;padding:5px 15px;border:1px solid black;cursor:pointer;background:rgba(200,200,200,0.4)}</style>');
$('a[href*="mode=editpost"]').click(function(){
if($(this).parents('.post').find('#contedit').length){
$('#contedit').fadeOut().remove();
}else{
$('#contedit').remove();
mylinkpathname = $(this).attr('href');
$(this).after('
<div id="contedit" style="box-shadow:0 0 10px grey;border:1px solid #555;margin-left:6%;padding:10px 15px;background:#f4f4f4;position:absolute;z-index:999;margin-top: 1%;margin-left: 901px;margin-top: -0px;">
  <p><div id="normedit" onmouseout="$(this).css(\'background\',\'rgba(255,255,255,0.8)\')" onmouseover="$(this).css(\'background\',\'rgba(200,200,200,0.5)\')"  style="font-weight:bold;color:#7D7D7D;transition:all 0.4s;border-bottom:1px solid grey;margin-bottom:1%;padding:10px 15px;background:rgba(255,255,255,0.8);cursor:pointer;">Editar Normal</div></p>
  <p><div id="rapidedit" onmouseout="$(this).css(\'background\',\'rgba(255,255,255,0.8)\')" onmouseover="$(this).css(\'background\',\'rgba(200,200,200,0.5)\')" style="font-weight:bold;color:#7D7D7D;transition:all 0.4s;padding:10px 15px;background:rgba(255,255,255,0.8);cursor:pointer;">Editar Rápido</div></p>
</div>
');
$('#rapidedit').bind('click', function(){
if($(this).parents('.post').find('#locsdeidit').length){
$('#locsdeidit').remove()}else{$('#locsdeidit').remove();
$(this).parents('.post').find('.post-entry').after('<div style="padding-left: 1.79%;" id="locsdeidit"><img src="http://www.wingshootingusa.org/2012/Images/loading_transparent.gif"></div>');
$('#locsdeidit').hide().fadeIn();
$.get(mylinkpathname, function(locg){
var html0 = $('.frm-form .frm-input', locg).html();
var html1 = $('.frm-form .frm-textarea', locg).html();
var html2 = $('.frm-form .frm-buttons', locg).html();
var htmlfinal = '<form onsubmit="return vB_Editor[\'text_editor\'].prepare_submit(0,0)" name="post" method="post" action="/post" enctype="multipart/form-data">' + html0 + html1 + html2 + '</form>';
$('#locsdeidit').html(htmlfinal);
});
jQuery('html,body').animate({scrollTop: jQuery('#locsdeidit').offset().top}, 1000);
$('#contedit').remove();
}
});
$('#normedit').bind('click', function(){
window.open(mylinkpathname, '_self')
});
$('#contedit').hide().fadeIn();
}
return false;
});
});

2º) Resultado:

[infos=] Texto: SuporteDesign.net ; Imagem: SuporteDesign.net ; Código: Desconhecido[/infos]

O Suporte Design dispõe de várias áreas de interesse do usuário, para que o mesmo possa desfrutar do nosso trabalho. Somos também, especialistas naquilo que fazemos, para auxiliar ao utilizador exatamente o que precisa.

[TUTORIAL] Editar Rápido

[TUTORIAL] Editar RápidoQui 7 Nov - 20:06

O Suporte Design dispõe de várias áreas de interesse do usuário, para que o mesmo possa desfrutar do nosso trabalho. Somos também, especialistas naquilo que fazemos, para auxiliar ao utilizador exatamente o que precisa.

[TUTORIAL] Editar Rápido

description[TUTORIAL] Editar RápidoQui 7 Nov - 20:06

[TUTORIAL] Editar RápidoQui 7 Nov - 20:06