Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Categories

Convert jQuery to Javascript

juegosfrivsjuegosfrivs Viet NamMember Posts: 0

<style> .msgBox{ position:absolute; z-index:10; border-radius:5px; border:1px solid #F5F5F5; background-color:#DDD; box-shadow:1px 1px 5px #999; overflow:hidden; display:none} .msgBox ul, .msgBox li{ list-style:none; padding:0; margin:0; border:0} .msgBox .title{ border-bottom:#AAA solid 1px; padding:5px; background-color:#CCC; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold; text-shadow:1px 1px #DDD; font-size:12px} .msgBox .msgContent{ border-top:#F5F5F5 solid 1px; padding:5px; text-shadow:1px 1px #F1F1F1; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; font-size:12px} .msgBox .ok{ text-shadow:1px 1px #F1F1F1; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; font-size:12px; margin:0 auto 5px auto; width:20px; padding:4px 5px 4px 5px; background-color:#CCC; text-align:center; cursor:pointer; transition:all 300ms linear; border:#DDD solid 1px; box-shadow:0 0 1px #AAA; border-radius:4px} .msgBox .ok:hover{ background-color:#EEE} </style> <div class="msgBox"> <ul class="title">Alert</ul> <ul class="msgContent">No messege</ul> <ul> <li class="ok">Ok</li> </ul> </div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script language="javascript"> // Upgraded confirm function var msgBox = function(msg){ var w =$(document).width(), h = $(document).height(); var msgW = $('.msgBox').width(), msgH = $('.msgBox').height(); $('.msgBox').css({left:(w-msgW)/2, top:(h-msgH)/2}); $('.msgBox') .show() .find('.msgContent').text(msg); $('.msgBox').find('.ok').click(function(){ $('.msgBox').hide(); }); $(document).keyup(function(event){ if(event.which==13){ $('.msgBox').hide(); } }); } msgBox('Enter your message!'); </script>

Demo: http://www.yepi3games.org/alert.htm

Tagged:
Sign In or Register to comment.