إضافة تأثير الضغط بالماوس لمنصة بلوجر
السلام عليكم ومرحباً بك زوار موقع " سيوتكس - SeoTux "
كما نعرف فمنظر الموقع من الأشياء التي تجعل الزائر يعجب بالموقع ويثق به ويعود الية من حين الى أخر والاضافة التي سنشرح لكم اليوم هي اضافة زينة خاصة اذا كان موقعك بلون فاتح
الاضافة بكل بساطة هي انك عندما تضغط على اي مكان فى الموقع ستظهر دائرة صغيرة حول المكان الذي ضغطت فية وهذة هي إضافة تأثير ضغطة الماوس.
لابد أنك ضغط ولو مرة واحدة فى هذا الموقع قبل أن تصل الى هنا. فأن قد فعلت ذلك فستلاحظ الأضافة لكن أن لم تفعل أو تريد معاينتها مرة اخرى فما عليك سوى ان تضغط هنا ليظهر معك تاثير CLICK
طريقة تركيب الاضافة تتمثل فى خطوتين :
الخطوة الأولي
أذهب إلى التخصيص >> تعديل
ثم ضع هذا الكود فوقة
<style type="text/css">
/* Mouse Click Effect Css By SeoTux */
.mteffect{width:60px;height:60px;border-radius:99em;border:3px solid #6200ee;position:fixed;left:50%;transform:scale(0.5);display:none;z-index:999}.mteffect.active{display:block;animation:mteffect 0.4s ease-out forwards}
@keyframes mteffect{from{transform:scale(0.2);opacity:1}to{transform:scale(1);opacity:0}}
</style>ستكون اضافة تأثير الضغط بالماوس في الاول بهذا اللون يمكنك تغيره بالبحث على #6200ee ثم ضع مكانه اللون الذي يناسبك و يريحك.
الخطوة الثانية نفس المراحل السابقة لكن هذه المرة ابحث على /body
ثم ضع هذا الكود فوقه
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>
<script>//<![CDATA[
$("body").append($('<span class="mteffect"></span>')),$(document).on("click",function(n){var i=n.clientX,a=n.clientY;$(".mteffect").css({top:a-30,left:i-30}).addClass("active")}),$(".mteffect").on("animationend webkitAnimationEnd oAnimationEnd oanimationend MSAnimationEnd",function(){$(".mteffect").removeClass("active")});
//]]>
</script>كما ذكرنا سابقا فاضافة تأثير الماوس ليس لها فائدة غير انها تضيف رونقا على الموقع او المدونة
اذا اعجبكم الشرح فلا تنسو متابعة موقعنا فنحن سنعمل جاهدين في سبيل ان نضع لكم افضل الشروحات و بطريقة بسيطة وسهلة
ان واجهتك اي مشكلة فلا تتردد في التواصل معنا من خلال صفحة اتصل بنا
