برخی از عناصر صفحات وب با قرار گرفتن در حالت شناور با ماوس ، ظاهر خود را تغییر می دهند - این به طور پیش فرض توسط تنظیمات زبان HTML برای آنها تجویز می شود (HyperText Markup Language - "Hypertext Markup Language"). این زبان ابزاری دارد که به شما امکان می دهد تنظیمات مشابه را برای سایر عناصر صفحه تغییر دهید. در صورت لزوم ، می توانید از CSS (Cascading Style Sheets) و زبان برنامه نویسی جاوا اسکریپت سمت مشتری برای این منظور استفاده کنید.
دستورالعمل ها
مرحله 1
از ویژگی style استفاده کنید تا بتوانید متغیر مکان نما را در برچسب صفحه وب مورد علاقه خود تنظیم کنید. به عنوان مثال ، کد HTML یک قسمت متن ورودی که به مرورگر بازدید کننده دستور می دهد ظاهر مکان نما را به همان روشی که هنگام قرار دادن صفحه روی یک پیوند تغییر می دهد ، می تواند به صورت زیر نوشته شود:
گام 2
ظاهر مکان نما مورد نظر را از لیست مقادیر معتبر پارامتر مکان نما انتخاب کنید. در مثالی که در مرحله قبل نشان داده شده است ، از مقدار اشاره گر استفاده شده است - مقدار عقربه دقیقاً همان تأثیر را دارد. علاوه بر این دو مقدار ، گزینه های زیر برای ظاهر مکان نما فراهم شده است: خط کشیدن ، تغییر اندازه الکترونیکی ، کمک ، حرکت ، تغییر اندازه n ، تغییر اندازه جدید ، تغییر اندازه nw ، پیشرفت ، تغییر اندازه s ، تغییر اندازه ، تغییر اندازه ، متن ، تغییر اندازه ، صبر کنید. به عنوان مثال ، برای اینکه نشانگر از بالا سمت چپ به پایین سمت راست در نمونه کد بالا مانند یک فلش دو سر به نظر برسد ، به جای اشاره گر از nw-resize استفاده کنید:
حروف جلوی مقدار تغییر اندازه به تعیین جهت جهت گیری پیکان توسط این مقدار کمک می کند - آنها مانند یک قطب نما ، با تعیین نقاط اصلی مطابقت دارند. به عنوان مثال ، nw مخفف nord-west (شمال غربی) ، s برای جنوب (جنوب) و غیره است.
مرحله 3
اگر تصویر نشانگر خود را در قالب منحنی اصلی آن بارگذاری کرده اید ، از URL فایل به جای مقادیر از پیش تعریف شده استفاده کنید. برای این کار از دستور زیر استفاده کنید:
<input style = "cursor: url (https://someSite.ru/someCursor.cur) "/>
اگر فایل در همان پوشه با صفحه یا در یک زیر پوشه قرار دارد ، می توانید به جای یک آدرس مطلق ، یک آدرس نسبی را تعیین کنید.
مرحله 4
اگر می خواهید با استفاده از JavaScript ظاهر مکان نما را تغییر دهید از ویژگی onmouseover استفاده کنید. مثلا:
این کد دقیقاً مانند نمونه مرحله دو کار خواهد کرد.
