Jump to content


Photo

Convert from Jquery to Javascript. Hepl me

javascript jquery

  • This topic is locked This topic is locked
2 replies to this topic

#1 Fb86

Fb86

    Newbie

  • New Members
  • Pip
  • 1 posts

Posted 30 April 2014 - 02:17 AM

<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


Edited by Fb86, 30 April 2014 - 02:18 AM.


#2 gristoi

gristoi

    Advanced Member

  • Members
  • PipPipPip
  • 842 posts

Posted 30 April 2014 - 07:19 AM

why would you want to convert something from a widely used modern scripting framework back to basic javascript?


To err is human... to really foul up requires the root password

#3 trq

trq

    Advanced Member

  • Administrators
  • 31,024 posts
  • LocationSydney, Australia.

Posted 18 August 2014 - 09:55 PM

http://www.catb.org/...-questions.html

http://thorpesystems.com | http://proemframework.org | http://github.com/trq

SmtpCatcher - A very simple mock sendmail useful for testing PHP mail scripts.
OPM - My Linux package manager.





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com