مايكروسوفت انترنت اكسبلورر 4 + و Netscape 6 + تدعم المؤشرات مخصصة محددة مع CSS.
على الرغم من أن المؤشرات لن يكون لديهم نظرة مخصصة في المتصفحات الأخرى التي عادة لا تدمر أي شيء. سوف تظهر هذه المتصفحات ببساطة العادي السهم المؤشر والتي ستكون القضية نفسها كما لو كنت امتنع عن تخصيص المؤشرات على الإطلاق.
ذلك ما لم يكن في الصفحة حقا لا يعمل بدون المؤشر مخصصة ينبغي ألا يكون هناك أسباب فنية لاختيار لا.
لكن قد تكون هناك أسباب أخرى للتفكير مرتين قبل ان يضيف المؤشر مخصصة لصفحات موقعك. يتم الخلط بسهولة العديد من المستخدمين أو غضب عندما يكون هناك موقع فواصل واجهة المستخدم القياسية.
خصائص الماوس
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]إضافة المؤشر مخصص
بناء الجملة من أجل مؤشر مخصصة هو هذا:
(ضع الماوس فوق كل وصلة لرؤية التأثير)
محدد {cursor:value}
على سبيل المثال:
- الكود:
-
<html>
<head>
<style type="text/css">
.xlink {cursor:crosshair}
.hlink{cursor:help}
</style>
</head>
<body>
<b>
<a href="mypage.htm" class="xlink">CROSS LINK</a>
<br>
<a href="mypage.htm" class="hlink">HELP LINK</a>
</b>
</body>
</html>
والروابط من المثال أعلاه تبدو مثل هذا:
إعادة تحديد المؤشر لصفحات كاملة
إذا كنت ترغب في إعادة تعريف المؤشر لدرجة انها لا تظهر إلا عندما انتقلت عبر ارتباط، يمكنك تحديد المؤشر ببساطة المطلوب باستخدام الجسم محدد.
على سبيل المثال:
- الكود:
-
<html>
<head>
<style type="text/css">
body {cursor:crosshair}
</style>
</head>
<body>
<b>
SOME TEXT
<br>
<a href="mypage.htm">ONE LINK</a>
<br>
<a href="mypage.htm">ANOTHER LINK</a>
</b>
</body>
</html>
انقر هنا لفتح النافذة التي تظهر نتيجة المثال أعلاه.
إعادة تحديد المؤشر لمناطق على صفحة
إذا كنت ترغب في نظرة واحدة من المؤشر في منطقة واحدة من الصفحة، وآخر مظهر المؤشر في منطقة أخرى يمكنك أن تفعل ذلك مع محددات تعتمد على السياق.
بهذه الطريقة، يمكنك إنشاء أنماط مختلفة للحصول على ارتباطات، التي تعتمد على السياق. الآن إذا تم تعيين السياق مع علامة وهمية، مثل
لم يكن لديك لتحديد النمط المطلوب في كل مرة هناك رابط في هذا الباب.
على سبيل المثال:
- الكود:
-
<html>
<head>
<style type="text/css">
.xlink A{cursor:crosshair}
.hlink A{cursor:help}
</style>
</head>
<body>
<b>
<span class="xlink">
<a href="mypage.htm">CROSS LINK 1</a><br>
<a href="mypage.htm">CROSS LINK 2</a><br>
<a href="mypage.htm">CROSS LINK 3</a><br>
</span>
<br>
<span class="hlink">
<a href="mypage.htm">HELP LINK 1</a><br>
<a href="mypage.htm">HELP LINK 2</a><br>
<a href="mypage.htm">HELP LINK 3</a><br>
</span>
</b>
</body>
</html>