هيلبرنت | Helpernt - اضافه كوبون بشكل جميل

هيلبرنت | Helpernt (https://www.helpernt.com/vb/index.php)

- ركن تطوير المواقع (https://www.helpernt.com/vb/forumdisplay.php?f=88)

- - اضافه كوبون بشكل جميل (https://www.helpernt.com/vb/showthread.php?t=11784)

اضافه كوبون بشكل جميل

السلام عليكم ورحمة الله وبركاته
الفكره بسيطه وهي كالاتي قدامك شريط بيقولك دوس عليه علشان تظهر الكود emoji22

https://i.imgur.com/NGvVieK.jpg

الشكل ده واول ما تاشر علي الشريط الشريط الاحمر يبعد تمام وانا ظابطه علي ثانيتين
اول ما يبعد الكود ايبان ويكون بالشكل ده

https://i.imgur.com/zxU6nig.jpg

واول ما تخلع الماشره عليه يرجع الشريط الاحمر لمكانه عامل تاثير بسيط للفلتر انه كلام الشريط الاحمر ميبانش ويظهر ذي مافي الصوره ولما يرجع الشريط يبانbye1
الكود سهل وبسيط وفكرته سهله

الاكواد

كود PHP:


		
			
<!doctype html>

<html>

  <head>

    <meta name="viewport" content="width=device-width" />

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <link rel="stylesheet" href="style.css">

    <title>test</title>





</head>

<style>

.coupon{

    border:2px dashed #C4D0CE;

    background-color:#fff;

    padding:10px;

    width:200px;

    margin:auto;

    margin-top:100px;

    overflow:hidden;

}

.coupon .code{

    text-align:right;

    color:#020202;

}



.coupon .dom{

    position:absolute;

    background-color:#901C3A;

    width:200px;

    padding:10px;

    margin-top:-10px;

    margin-left:-10px;

    cursor:pointer;

    transition:transform 2s ,filter 2s,width 2s ;

    

}

.coupon .dom:hover{

    filter: blur(8px);

    transform:translate(-200px,0px);

    border:1px dashed #C4D0CE;

}

</style>

<body>

    

    <div class="coupon">

            <div id="click" class="dom">click to show coupon</div>

            <div class="code">Helpernt.com</div>

    </div>

    



</body>

الشكل التاني
اما لو عايزه يكون بالشكل ده واول ما تاشر عليه الكلام يظهر
https://i.imgur.com/4LY9ufX.jpg
ويكون بالشكل ده
https://i.imgur.com/xObVrmX.jpg

code

كود PHP:


		
			
<!doctype html>

<html>

  <head>

    <meta name="viewport" content="width=device-width" />

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <link rel="stylesheet" href="style.css">

    <title>test</title>





</head>



<body>

    <style>

    .coupon{

    border:2px dashed #C4D0CE;

    background-color:#fff;

    padding:10px;

    width:200px;

    margin:auto;

    margin-top:100px;

    overflow:hidden;

}

.coupon .code{

    text-align:center;

    color:#020202;

    filter: blur(8px);

    transition:filter 1s;

}

.coupon .code:hover{

    filter: blur(0px);

}



    </style>

    <div class="coupon">

            <div class="code">Helpernt.com</div>

    </div>

    



</body>

رد: اضافه كوبون بشكل جميل

امممممممممم دى نفس الكود او شبيه بالكودات اللى تستخدم فى مواقع الدومينات او الاستضافات لما يكون لديك كوبون

عاااااااشت الايادى

رد: اضافه كوبون بشكل جميل

اقتباس:

المشاركة الأصلية كتبت بواسطة هيلبرنت (المشاركة 40836)

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

رد: اضافه كوبون بشكل جميل

جميل جدا

كود مطلوب بشدة خصوصا فى مواقع ذات الصله بالعروض والكوبونات

بارك الله فيك اخى محمد

ولاتحرمنا من كتاباتك

رد: اضافه كوبون بشكل جميل

اقتباس:

المشاركة الأصلية كتبت بواسطة abo-karim (المشاركة 40861)

نورت الموضوع يابو كريم مطولش علينا ياغالي فين لفين لما حد يشوفك

رد: اضافه كوبون بشكل جميل

السلام عليكم ورحمة الله وبركاته ..
بارك الله فيك اخي محمد
كود مهم جدا ومطلوب بكثرة
شكرا