النتائج 1 إلى 4 من 4

الموضوع: كيف تفتح نافذة منبثقة ثم تغلق و تفتح الصفحة الأولى؟

  1. #1
    عضو نشيط جدا
    تاريخ التسجيل
    Jan 2002
    المشاركات
    427

    Thumbs down كيف تفتح نافذة منبثقة ثم تغلق و تفتح الصفحة الأولى؟



    السلام عليكم ورحمة الله وبركاته
    أحبائي
    نلاحظ في بعض المواقع أنك مثلا حينما تريد أن تدخل إلى حسابك يقول لك : اضغط هنا للدخول لحسابك الإلكتروني ( وهذ الكلام موجود في الصفحة رقم 1 )
    ثم تضغط على الكلام الذي على الصفحة رقم 1 وتفتح لك نافذة صغيرة تدخل فيها اسم المستخدم و الرقم السري , ثم تضغط موافق , ثم تتقفل هذه الصفحة المنبثقة , ويتم فتح حسابك في الصفحة رقم 1
    سؤالي :
    كيف أسوي مثل هذه الحركة؟ بحيث إنها تفتح في نافذة ثم تعود للصفحة الرئيسية
    وشكرا لكم





    __________________
    لا تنتظر حتي تصبح عظيماً لتبدأ ، ابدأ حتي تصبح عظيماً..




  2. يمكنك عملها بـجافا سكربت والاجاكس .

    PJ Hyett : The Lightbox Effect without Lightbox
    هذا تطبيق قد يفيدك





    __________________
    ownersınnı
    ALdiraZi BLoOoG | Contact Me | lt.tl - shorten your URL

  3. #3
    عضو نشيط جدا
    تاريخ التسجيل
    Jan 2002
    المشاركات
    427

    جزاك الله خير أخي



    بس تصدق الفكرة جدا جميلة
    لكن
    بصراحة
    الأكواد تفجع
    ماني عارف كيف أكتبها
    ممكن تساعدني
    معليش تراني ما ني ونعم في الجافا





    __________________
    لا تنتظر حتي تصبح عظيماً لتبدأ ، ابدأ حتي تصبح عظيماً..





  4. اول شي تضع الستايلات في ملف الـcss

    #overlay{
    background-image: url(/images/overlay.png);
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 90;
    width: 100%;
    height: 100%;
    }


    * html #overlay{
    background-color: #333;
    background-color: transparent;
    background-image: url(blank.gif);
    filter: progidXImageTransform.Microsoft.AlphaImageLoader(
    src="/images/overlay.png", sizingMethod="scale");
    }


    #box{
    width:300px;
    background:#2d2d2d;
    padding:10px;
    border:2px solid #eee;
    }


    #close{
    position:absolute;
    top:-5px;
    right:-5px;
    cursorointer;
    }

    بعدين تضع هذي الاكواد في ملف JS , | اذا ما تعرف تضعهم في ملف JS افتح النوت باد (المفكرة) واعمل بيست وبعدين حفظ باسم login.js مثلا او قم بنسخ اي ملف جافا سكربت من اي سكربت وافرغه من الاكواد وضع فيه الاكواد الجديدة

    function showBox(){
    $('overlay').show();
    center('box');
    return false;
    }


    function hideBox(){
    $('box').hide();
    $('overlay').hide();
    return false;
    }


    function center(element){
    try{
    element = $(element);
    }catch(e){
    return;
    }


    var my_width = 0;
    var my_height = 0;


    if ( typeof( window.innerWidth ) == 'number' ){
    my_width = window.innerWidth;
    my_height = window.innerHeight;
    }else if ( document.documentElement &&
    ( document.documentElement.clientWidth ||
    document.documentElement.clientHeight ) ){
    my_width = document.documentElement.clientWidth;
    my_height = document.documentElement.clientHeight;
    }
    else if ( document.body &&
    ( document.body.clientWidth || document.body.clientHeight ) ){
    my_width = document.body.clientWidth;
    my_height = document.body.clientHeight;
    }


    element.style.position = 'absolute';
    element.style.zIndex = 99;


    var scrollY = 0;


    if ( document.documentElement && document.documentElement.scrollTop ){
    scrollY = document.documentElement.scrollTop;
    }else if ( document.body && document.body.scrollTop ){
    scrollY = document.body.scrollTop;
    }else if ( window.pageYOffset ){
    scrollY = window.pageYOffset;
    }else if ( window.scrollY ){
    scrollY = window.scrollY;
    }


    var elementDimensions = Element.getDimensions(element);


    var setX = ( my_width - elementDimensions.width ) / 2;
    var setY = ( my_height - elementDimensions.height ) / 2 + scrollY;


    setX = ( setX < 0 ) ? 0 : setX;
    setY = ( setY < 0 ) ? 0 : setY;


    element.style.left = setX + "px";
    element.style.top = setY + "px";


    element.style.display = 'block';
    }
    وبعدين في المكان اللي تبغيه ضع هذا الكود

    <div id="overlay" onclick="hideBox()" style="display:none"></div>


    <div id="box" style="display:none">
    <img id="close" src="/images/close.gif" onclick="hideBox()" alt="Close"
    title="Close this window" />
    Here's a bunch of really sweet content!
    </div>


    ايضا تحتاج الى تحميل هذا الملف واستدعائه في الهيدر
    Prototype JavaScript framework: Download Prototype





    التعديل الأخير تم بواسطة owner ; 15-06-2008 الساعة 12:55 PM سبب آخر: اضافة بعض الاكواج
    __________________
    ownersınnı
    ALdiraZi BLoOoG | Contact Me | lt.tl - shorten your URL





ضوابط المشاركة

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •  

أضف موقعك هنا| اخبار السيارات | حراج | شقق للايجار في الكويت | بيوت للبيع في الكويت | دليل الكويت العقاري | مقروء | شركة كشف تسربات المياه | شركة عزل اسطح بالرياض | عزل فوم بالرياض| عزل اسطح بالرياض | كشف تسربات المياة بالرياض | شركة عزل اسطح بالرياض