estilos popup

This commit is contained in:
fbsanchez 2018-10-25 14:01:12 +02:00
parent 50aa314191
commit 85051924b7
4 changed files with 165 additions and 202 deletions

View File

@ -198,8 +198,12 @@ echo "<div class='modalgobutton gopandora'>
<script> <script>
$(".cerrar").click(function(){ $(".cerrar").click(function(){
$("#alert_messages").hide(); $("#alert_messages")
$( "#opacidad" ).remove(); .css('opacity', 0)
.hide();
$( "#opacidad" )
.css('opacity', 0)
.remove();
}); });
$(".gopandora").click(function(){ $(".gopandora").click(function(){

View File

@ -34,7 +34,9 @@
$(document).ready (function () { $(document).ready (function () {
$("a#show_messages_dialog").click (function () { $("a#show_messages_dialog").click (function () {
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "operation/messages/message_list"}, {
"page": "operation/messages/message_list"
},
function (data, status) { function (data, status) {
$("#dialog_messages").hide () $("#dialog_messages").hide ()
.empty () .empty ()
@ -49,8 +51,7 @@ $(document).ready (function () {
}, },
width: 700, width: 700,
height: 300 height: 300
}) }).show ();
.show ();
}, },
"html" "html"
); );
@ -59,41 +60,39 @@ $(document).ready (function () {
}); });
$("a.show_systemalert_dialog").click (function () { $("a.show_systemalert_dialog").click (function () {
$('body').append( "<div id='opacidad' style='position:fixed;background:black;z-index:1'></div>" );
$("#opacidad").css('opacity', 0.5);
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "include/ajax/config.ajax", {
"page": "include/ajax/config.ajax",
"token_name": 'visual_animation' "token_name": 'visual_animation'
}, },
function (data, status) { function (data, status) {
if(data){ if(data){
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.001;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "operation/system_alert"}, {
"page": "operation/system_alert"},
function (data, status) { function (data, status) {
$("#alert_messages").toggle();
$("#alert_messages").css('width','auto');
$("#alert_messages").css('height','auto');
$("#alert_messages").css('visibility','hidden');
$("#alert_messages").empty ().append (data); $("#alert_messages").empty ().append (data);
$("#alert_messages").css('display','block'); $("#alert_messages").css('opacity', 1);
setTimeout( function() {
animation_modal('alert_messages');
}, 50);
}, },
"html" "html"
); );
return false; return false;
} } else {
else{
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.6;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "operation/system_alert"}, {
"page": "operation/system_alert"},
function (data, status) { function (data, status) {
$("#alert_messages").hide () $("#alert_messages").hide ()
.empty () .empty ()
.append (data) .append (data)
.show (); .show ()
.css('opacity', 1);
}, },
"html" "html"
); );
@ -106,38 +105,30 @@ $(document).ready (function () {
$("a.modalpopup").click (function () { $("a.modalpopup").click (function () {
var elem = $(this).attr("id"); var elem = $(this).attr("id");
$('body').append( "<div id='opacidad' style='position:fixed;background:black;z-index:1'></div>" );
$("#opacidad").css('opacity', 0.5);
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "include/ajax/config.ajax", {
"page": "include/ajax/config.ajax",
"token_name": 'visual_animation' "token_name": 'visual_animation'
}, },
function (data, status) { function (data, status) {
if(data){ if(data){
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.001;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{ {
"page": "general/alert_enterprise", "page": "general/alert_enterprise",
"message": elem "message": elem
}, },
function (data, status) { function (data, status) {
$("#alert_messages").toggle();
$("#alert_messages").css('width','auto');
$("#alert_messages").css('height','auto');
$("#alert_messages").css('visibility','hidden');
$("#alert_messages").empty ().append (data); $("#alert_messages").empty ().append (data);
$("#alert_messages").css('display','block'); $("#alert_messages").css('opacity', 1);
setTimeout( function() {
animation_modal('alert_messages');
}, 50);
}, },
"html" "html"
); );
return false; return false;
} } else {
else{
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.6;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{ {
"page": "general/alert_enterprise", "page": "general/alert_enterprise",
@ -147,7 +138,8 @@ $(document).ready (function () {
$("#alert_messages").hide () $("#alert_messages").hide ()
.empty () .empty ()
.append (data) .append (data)
.show (); .show ()
.css('opacity', 1);
}, },
"html" "html"
); );
@ -159,48 +151,32 @@ $(document).ready (function () {
}); });
// Creacion de ventana modal y botones // Creacion de ventana modal y botones
$(".publienterprise").click (function () { $(".publienterprise").click (function () {
var elem = $(this).attr("id"); var elem = $(this).attr("id");
$('body').append( "<div id='opacidad' style='position:fixed;background:black;z-index:1'></div>" );
$("#opacidad").css('opacity', 0.5);
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{"page": "include/ajax/config.ajax", {
"page": "include/ajax/config.ajax",
"token_name": 'visual_animation' "token_name": 'visual_animation'
}, },
function (data, status) { function (data, status) {
if(data){ if(data){
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.001;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{ {
"page": "general/alert_enterprise", "page": "general/alert_enterprise",
"message": elem "message": elem
}, },
function (data, status) { function (data, status) {
$("#alert_messages").toggle();
$("#alert_messages").css('width','auto');
$("#alert_messages").css('height','auto');
$("#alert_messages").css('visibility','hidden');
$("#alert_messages").empty ().append (data); $("#alert_messages").empty ().append (data);
$("#alert_messages").css('display','block'); $("#alert_messages").css('opacity', 1);
setTimeout( function() {
animation_modal('alert_messages');
}, 50);
}, },
"html" "html"
); );
return false; return false;
} else {
}
else{
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.6;z-index:1'></div>" );
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{ {
"page": "general/alert_enterprise", "page": "general/alert_enterprise",
@ -210,21 +186,21 @@ $(document).ready (function () {
$("#alert_messages").hide () $("#alert_messages").hide ()
.empty () .empty ()
.append (data) .append (data)
.show (); .show ()
.css('opacity', 1);
}, },
"html" "html"
); );
return false; return false;
} }
}, },
"html" "html");
);
}); });
$(".publienterprisehide").click (function () { $(".publienterprisehide").click (function () {
$('body').append( "<div id='opacidad' style='position:fixed;background:black;opacity:0.6;z-index:1'></div>" ); $('body').append( "<div id='opacidad' style='position:fixed;background:black;z-index:1'></div>" );
$("#opacidad").css('opacity', 0.5);
jQuery.post ("ajax.php", jQuery.post ("ajax.php",
{ {
"page": "general/alert_enterprise", "page": "general/alert_enterprise",
@ -234,12 +210,11 @@ $(document).ready (function () {
$("#alert_messages").hide () $("#alert_messages").hide ()
.empty () .empty ()
.append (data) .append (data)
.show (); .show ()
.css('opacity', 1);;
}, },
"html" "html"
); );
return false; return false;
}); });
@ -341,34 +316,27 @@ $(document).ready (function () {
if($('#head').css('position') =='fixed'){ if($('#head').css('position') =='fixed'){
if($('#menu').css('position') =='fixed'){ if($('#menu').css('position') =='fixed'){
$('#menu').css('top','80px'); $('#menu').css('top','80px');
} } else {
else{
$('#menu').css('top','60px'); $('#menu').css('top','60px');
} }
} } else {
else{
if($('#menu').css('position') =='fixed'){ if($('#menu').css('position') =='fixed'){
$('#menu').css('top','20px'); $('#menu').css('top','20px');
} } else {
else{
$('#menu').css('top','80px'); $('#menu').css('top','80px');
} }
} }
} } else {
else{
if($('#head').css('position') =='fixed'){ if($('#head').css('position') =='fixed'){
if($('#menu').css('position') =='fixed'){ if($('#menu').css('position') =='fixed'){
$('#menu').css('top','80px'); $('#menu').css('top','80px');
} } else {
else{
$('#menu').css('top','60px'); $('#menu').css('top','60px');
} }
} } else {
else{
if($('#menu').css('position') =='fixed'){ if($('#menu').css('position') =='fixed'){
$('#menu').css('top','80px'); $('#menu').css('top','80px');
} } else {
else{
$('#menu').css('top','80px'); $('#menu').css('top','80px');
} }
} }
@ -402,6 +370,9 @@ $("#alert_messages").css({'left':+parseInt(screen.width/2)-parseInt($("#alert_me
}); });
function forced_title_callback() { function forced_title_callback() {
// Forced title code // Forced title code
$('body').on('mouseenter', '.forced_title', function() { $('body').on('mouseenter', '.forced_title', function() {
@ -483,22 +454,3 @@ function forced_title_callback() {
}); });
} }
function animation_modal(id){
var animation_width = $("#"+id).css('width');
var animation_height = $("#"+id).css('height');
var posanimation_left = parseInt($('#'+id).css('left'));
var preanimation_left = parseInt($('#'+id).css('left'))+parseInt($('#'+id).css('left'))/2;
$('#'+id).css({'width':'100px','height':'60px'});
$("#alert_messages").css('visibility','visible');
$('#'+id).css('left',+preanimation_left+'px');
$('#'+id).css('opacity',0);
$('#opacidad').animate({'opacity':0.8},2000);
$("#"+id)
.animate({'width': animation_width,'left':posanimation_left+'px','opacity':1},1000)
.animate({'height': animation_height},1000);
}

View File

@ -3598,6 +3598,8 @@ div.simple_value > a > span.text p
max-width:750px; max-width:750px;
top: 20%; top: 20%;
background:white; background:white;
opacity: 0;
transition: opacity 0.5s;
} }
.modalheader{ .modalheader{
text-align:center; text-align:center;
@ -3806,7 +3808,8 @@ color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px;
#opacidad{ #opacidad{
opacity:0.5; opacity:0;
transition: opacity 3s;
z-index:1; z-index:1;
width:100%; width:100%;
height:100%; height:100%;

View File

@ -32,8 +32,12 @@ echo "<div class='modalokbutton cerrar' style='margin-top: 10px'>
<script> <script>
$(".cerrar").click(function(){ $(".cerrar").click(function(){
$("#alert_messages").hide(); $("#alert_messages")
$( "#opacidad" ).remove(); .css('opacity', 0)
.hide();
$( "#opacidad" )
.css('opacity', 0)
.remove();
}); });
</script> </script>