This commit is contained in:
2026-07-02 17:02:25 -06:00
parent 05f2b55fce
commit 3911bd5bc1
3 changed files with 120 additions and 111 deletions
+118 -106
View File
@@ -1,127 +1,139 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<style> <style>
.sec0 { .sec0 {
background-image: url(img/fondos/bg13.jpg); background-image: url(img/fondos/bg13.jpg);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
background-position: center; background-position: center;
} }
.bubble { .bubble {
width: 100%; height: auto; background-image: linear-gradient(to bottom, #f9f9f9, #f5f5f5, #f1f1f1, #ededed, #e9e9e9); width: 100%;
border-top-left-radius: 25px; border-top-right-radius: 25px; border-bottom-right-radius: 25px; height: auto;
} background-image: linear-gradient(to bottom, #f9f9f9, #f5f5f5, #f1f1f1, #ededed, #e9e9e9);
.paper { position: relative; margin: auto;} border-top-left-radius: 25px;
.txt_paper { position: absolute; top: 78px; left: 15px; padding: 0 1rem;} border-top-right-radius: 25px;
.anim { opacity: 0; } border-bottom-right-radius: 25px;
}
</style> .paper {
</head> position: relative;
<body> margin: auto;
}
.txt_paper {
position: absolute;
top: 78px;
left: 15px;
padding: 0 1rem;
}
.anim {
opacity: 0;
}
</style>
</head>
<body>
<div class="section_charge bg w-100 h-100"> <div class="section_charge bg w-100 h-100">
<div class="d-none"> <div class="d-none">
<img src="img/fondos/bg7.jpg" alt=""> <img src="img/fondos/bg7.jpg" alt="" />
</div> </div>
<section id="sec0" class="sec0 w-100 h-100"> <section id="sec0" class="sec0 w-100 h-100">
<div class="container h-100"> <div class="container h-100">
<div class="row justify-content-center align-items-center h-100"> <div class="row justify-content-center align-items-center h-100">
<div class="col-3 align-self-end"> <div class="col-3 align-self-end">
<div class="personaje_m_8 mx-auto anim anim2"></div> <div class="personaje_m_8 mx-auto anim anim2"></div>
</div>
<div class="col-8">
<div class="bubble p-2">
<p class="m-0">
Antes de terminar con nuestro curso, es tiempo de recordar lo más importante en relación con las <b>nuevas disposiciones</b> para la
prevención y detección de operaciones con recursos de procedencia ilícita:
</p>
</div>
<div class="paper mt-3 anim anim1">
<img src="img/64.png" alt="">
<div class="txt_paper">
<ol type="1" start="1" class="list_paper">
<li class="my-2 anim anim3">
Estas disposiciones establecen las medidas y procedimientos mínimos para prevenir y detectar actos, omisiones u
operaciones que pudieran favorecer delitos de operaciones con recursos de procedencia ilícita y financiamiento al terrorismo.</li>
<li class="my-2 anim anim4">Estas disposiciones entraron en vigencia a partir de 2021.</li>
<li class="my-2 anim anim5">Existen una serie de conceptos previstos que debes recordar como lo son: Cliente, Beneficiario, Grado de Riesgo, entre otros.</li>
<li class="my-2 anim anim6">
El Manual de Cumplimiento para estas disposiciones está conformado por tres aspectos centrales: la identificación del
cliente, el enfoque basado en riesgos, el conocimiento del cliente.
</li>
</ol>
</div>
</div>
</div>
</div>
</div> </div>
</section> <div class="col-8">
<div class="bubble p-2">
<p class="m-0">
Antes de terminar con nuestro curso, es tiempo de recordar lo más importante en relación con las
<b>nuevas disposiciones</b>
para la prevención y detección de operaciones con recursos de procedencia ilícita:
</p>
</div>
<div class="paper mt-3 anim anim1">
<img src="img/64.png" alt="" />
<div class="txt_paper">
<ol type="1" start="1" class="list_paper">
<li class="my-2 anim anim3">
Estas disposiciones establecen las medidas y procedimientos mínimos para prevenir y detectar
actos, omisiones u operaciones que pudieran favorecer delitos de operaciones con recursos de
procedencia ilícita y financiamiento al terrorismo.
</li>
<li class="my-2 anim anim4">Estas disposiciones entraron en vigencia a partir de 2021.</li>
<li class="my-2 anim anim5">
Existen una serie de conceptos previstos que debes recordar como lo son: Cliente, Beneficiario,
Grado de Riesgo, entre otros.
</li>
<li class="my-2 anim anim6">
El Manual de Cumplimiento para estas disposiciones está conformado por tres aspectos centrales: la
identificación del cliente, el enfoque basado en riesgos, el conocimiento del cliente.
</li>
</ol>
</div>
</div>
</div>
</div>
</div>
</section>
</div> </div>
</body> </body>
</html> </html>
<script> <script>
jQuery(document).ready(function($) { jQuery(document).ready(function ($) {
instruccion(0); instruccion(0);
var Audio_23 = newSound("audio/Audio_23_Marcos.mp3"); var Audio_23 = newSound('audio/Audio_23_Marcos.mp3');
var txt2 = "<ol type='1' start='5' class='list_paper'><li class='anim anim7 my-2'>Existen tres tipos de Operaciones que pueden ser reportadas: inusuales, relevantes e internas preocupantes.</li><li class='anim anim8 my-2'>En caso de detectar alguna irregularidad, puedes acudir al Comité de Comunicación y Control, así como al Oficial de Cumplimiento.</li><li class='anim anim9 my-2'>Toda la información que sea compartida debe mantener una absoluta confidencialidad.</li></ol>"; var txt2 =
"<ol type='1' start='5' class='list_paper'><li class='anim anim7 my-2'>Existen tres tipos de Operaciones que pueden ser reportadas: inusuales, relevantes e internas preocupantes.</li><li class='anim anim8 my-2'>En caso de detectar alguna irregularidad, puedes acudir al Comité de Comunicación y Control, así como al Oficial de Cumplimiento.</li><li class='anim anim9 my-2'>Toda la información que sea compartida debe mantener una absoluta confidencialidad.</li></ol>";
Audio_23.on("play", function() { Audio_23.on('play', function () {
var tl2 = new TimelineMax(); var tl2 = new TimelineMax();
tl2.fromTo(".anim3",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 11.042); tl2.fromTo('.anim3', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 10.8);
tl2.fromTo(".anim4",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 24.464); tl2.fromTo('.anim4', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 26);
tl2.fromTo(".anim5",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 29.800); tl2.fromTo('.anim5', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 31);
tl2.fromTo(".anim6",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 39.696); tl2.fromTo('.anim6', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 42);
tl2.call(fn_list); setTimeout(fn_list, 56000);
}); });
Audio_23.on("end", function() { Audio_23.on('end', function () {
$('.personaje_m_8').removeClass('play'); $('.personaje_m_8').removeClass('play');
fn_end(); fn_end();
}); });
$(".layer-load").show(); $('.layer-load').show();
$('.section_charge').waitForImages({ $('.section_charge').waitForImages({
finished: function() { finished: function () {
$(".section_charge").css("visibility", "visible"); $('.section_charge').css('visibility', 'visible');
$(".wloader").hide(); $('.wloader').hide();
fn_animate(); fn_animate();
},
}, each: function (loaded, count, success) {
each: function(loaded, count, success) { var total = Math.floor((loaded * 100) / count);
var total = Math.floor((loaded * 100) / count); $('.wloader').show();
$(".wloader").show(); },
waitForAll: true
},
waitForAll: true
}); });
function fn_animate() {
function fn_animate(){ var tl = new TimelineMax();
var tl = new TimelineMax(); tl.fromTo('.anim2', 1, { opacity: 0, x: -150 }, { opacity: 1, x: 0, ease: Expo.easeInOut });
tl.fromTo(".anim2",1,{opacity:0, x:-150},{opacity:1, x:0, ease:Expo.easeInOut}); tl.fromTo('.anim1', 0.7, { opacity: 0, y: -250 }, { opacity: 1, y: 0, ease: Expo.easeInOut });
tl.fromTo(".anim1",.7,{opacity:0, y:-250},{opacity:1, y:0, ease:Expo.easeInOut}); tl.call(fn_firstAudio);
tl.call(fn_firstAudio);
} }
function fn_firstAudio(){ function fn_firstAudio() {
stopAllSoundsAndPlay(Audio_23); stopAllSoundsAndPlay(Audio_23);
$('.personaje_m_8').addClass('play'); $('.personaje_m_8').addClass('play');
} }
function fn_list(){ function fn_list() {
setTimeout(function(){ $('.txt_paper').html(txt2);
$('.txt_paper').html(txt2); var tl3 = new TimelineMax();
var tl3 = new TimelineMax(); tl3.fromTo('.anim7', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut });
tl3.fromTo(".anim7",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}); tl3.fromTo('.anim8', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 10);
tl3.fromTo(".anim8",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 8.75); tl3.fromTo('.anim9', 0.7, { opacity: 0, y: -100 }, { opacity: 1, y: 0, ease: Expo.easeInOut }, 19);
tl3.fromTo(".anim9",.7,{opacity:0, y:-100},{opacity:1, y:0, ease:Expo.easeInOut}, 16.248);
}, 12000);
} }
function fn_end(){ function fn_end() {
instruccion(1); instruccion(1);
} }
});
</script>
});
</script>
+2 -5
View File
@@ -4,7 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, maximum-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, maximum-scale=1" />
<title>MAPFRE</title> <title>Mapfre</title>
<link rel="icon" href="data:," />
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/sweetalert2.min.css" /> <link rel="stylesheet" type="text/css" href="css/sweetalert2.min.css" />
<link rel="stylesheet" type="text/css" href="css/borderless.min.css" /> <link rel="stylesheet" type="text/css" href="css/borderless.min.css" />
@@ -235,10 +236,6 @@
</div> </div>
</div> </div>
<!-- js --> <!-- js -->
<script
crossorigin="anonymous"
src="https://polyfill.io/v3/polyfill.min.js?version=3.52.0&features=blissfuljs%2Cdefault%2Ces2015%2Ces2016%2Ces2017%2Ces2018%2Ces2019%2Ces5%2Ces6%2Ces7"
></script>
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
<!--<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>--> <!--<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>-->
<script src="js/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
Binary file not shown.