Header Ads

Header ADS

ايقاف زر الماوس الأيمن فى بلوجر واضافة قائمة منسدله عليه

اضافة احترافيه جدا سوف تفيد كثيرا اصحاب المدونات الذى يقدمون محتوى حصرى ، هذه الإضافة رائعه جدا يمكنك أستخدامها فى مدونتك لمنع اى شخص من نسخ المحتوى الخاص بك أو بمعنى أخر منعه من أستخدام زر الماوس الأيمن ووضع بدل من القائمة العادية التى تظهر لزورا مدونتك الخاص بالمتصفحة قائمة خاص بك أنت.

ايقاف زر الماوس الأيمن فى بلوجر واضافة قائمة منسدله عليه


هذا القائمة سوف تفيدك كثيرا فى أنك يمكنك وضع بها روابط مواقع التواصل الخاص بك أو اى روابط تريدها لقسم معين أو اى شئ تريده والقائمة بتسمية رائع جدا وبتنسق احترافي للأكواد .


معاينة الإضافة




صورة من الإضافة


ايقاف زر الماوس الأيمن فى بلوجر واضافة قائمة منسدله عليه


شرح التركيب


التركيب للأضافة سهل جدا فى وضع أكواد قليله فى مدونتك لتفعيل القائمة وايقاف الماوس ، سوف تبحث عن هذا الوسم</head>وتوقم وبوضع الكود التالى فوقه وفى بعض القوالب سوف تجد الوسم بهذا الشكل&lt;/head&gt;&lt;!--<head/>--&gt;ضع فوقه ايضا.

<!-- CSS -->
<style type='text/css'>
.menuMsTamvan{max-width:250px;color:#fff;position:absolute;z-index:999999;display:none;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);border-radius:3px;overflow:hidden}
@media only screen and (max-width:300px){.menuMsTamvan{width:50%}}
@media only screen and (min-width:300px){.menuMsTamvan{width:30%}}
.menuMsTamvan ul{list-style:none;padding:0;margin:0}
.menuMsTamvan ul li{margin:0;padding:0}
.menuMsTamvan ul li a{padding:6%;display:block;box-sizing:border-box;text-decoration:none;position:relative;background-color:#F04D44;color:#fff;-webkit-transition:background-color 1000ms linear;-moz-transition:background-color 1000ms linear;-o-transition:background-color 1000ms linear;-ms-transition:background-color 1000ms linear;transition:background-color 1000ms linear}
.menuMsTamvan ul li a:hover{background-color:#F7BA4B;color:#444343}
</style>

الأن ايضا فى فوق نفس الوسم قم بوضع الكود التالى.

<!-- JavaScript-->
<script type='text/javascript'>
$(document).ready(function() {
$(&quot;html&quot;).on(&quot;contextmenu&quot;, function(e) {
e.preventDefault();
var menuMsTamvan = $(&quot;.menuMsTamvan&quot;);
menuMsTamvan.hide();
var pageX = e.pageX;
var pageY = e.pageY;
menuMsTamvan.css({
top: pageY,
left: pageX
});
var mwidth = menuMsTamvan.width();
var mheight = menuMsTamvan.height();
var screenWidth = $(window).width();
var screenHeight = $(window).height();
var scrTop = $(window).scrollTop();
if (pageX + mwidth &gt; screenWidth) {
menuMsTamvan.css({
left: pageX - mwidth
});
}
if (pageY + mheight &gt; screenHeight + scrTop) {
menuMsTamvan.css({
top: pageY - mheight
});
}
menuMsTamvan.show();
});
$(&quot;html&quot;).on(&quot;click&quot;, function() {
$(&quot;.menuMsTamvan&quot;).hide();
});
});
</script>

الأن اخر كود وسوف تقوم بوضعه فوقه هذا الوسم<body>وهذا الكود الذى سوف تعدل عليه لتفعيل القائمة

<div class='menuMsTamvan'>
<ul>
<li><a href='/'>الصفحة الرئيسية</a></li>
<li><a href='#'>تابعونا على فيسبوك</a></li>
<li><a href='#'>تابعونا على تويتر</a></li>
<li><a href='#'>تابعونا على يوتيوب</a></li>
<li><a href='#'>انضم الينا</a></li>
</ul>
</div>

وبعد وضع الكود سوف تقوم بتعديل الروابط والعبارات التى فى الكود بما  يناسبك وبعد ذلك قم بحفظ القالب ومبروك عليك الإضافة.

هذا كل شئ فى موضوع اليوم بالتوفيق للجميع وأنتظرونا بكل جديد بأذن الله على المدونة ، لا تنس مشاركة الموضوع حتى يتسفيد غيرك وأى مشكلة تجدها تضعها فى تعليق .

Aucun commentaire

Fourni par Blogger.