سبد (0)

خصوصیت cursor

مثال (خصوصیت cursor)

زمانی که موس روی <span>های مختلف می رود، شکل عادی موس تغییر می کند:

span.crosshair {cursor:crosshair}
span.help {cursor:help}
span.wait {cursor:wait}
خودتان امتحان کنید »

تعریف و کاربرد

با استفاده از خصوصیت cursor، می توانید نحوه ی نمایش مکان نما را زمانی که به یک عنصر اشاره می کند تغییر دهید.

مقدار پیشفرض auto
ارث بری بله
نسخه CSS2
JavaScript ساختار object.style.cursor="crosshair"

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت cursor را پشتیبانی می کنند.

توجه: مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقدار "inherit" را پشتیبانی نمی کند. IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار "inherit" را پشتیبانی می کند.


مقدارهای خصوصیت

مقدارنمایش دادن
alias نمایش دادن »
all-scroll نمایش دادن »
auto نمایش دادن »
cell نمایش دادن »
context-menu نمایش دادن »
col-resize نمایش دادن »
copy نمایش دادن »
crosshair نمایش دادن »
default نمایش دادن »
e-resize نمایش دادن »
ew-resize نمایش دادن »
help نمایش دادن »
move نمایش دادن »
n-resize نمایش دادن »
ne-resize نمایش دادن »
nesw-resize نمایش دادن »
ns-resize نمایش دادن »
nw-resize نمایش دادن »
nwse-resize نمایش دادن »
no-drop نمایش دادن »
none نمایش دادن »
not-allowed نمایش دادن »
pointer نمایش دادن »
progress نمایش دادن »
row-resize نمایش دادن »
s-resize نمایش دادن »
se-resize نمایش دادن »
sw-resize نمایش دادن »
text نمایش دادن »
URL نمایش دادن »
vertical-text نمایش دادن »
w-resize نمایش دادن »
wait نمایش دادن »
zoom-in نمایش دادن »
zoom-out نمایش دادن »
inherit  

دیدگاه‌ها  

+2 # امیرکیان 1394-02-17 14:10
لطفاً در مورد تغییر کرسر به ایکون مورد نظر بگویید.
باید ایکون چه سایزی داشته باشد؛چه پسوندی داشته باشد؛یک نمونه کد برای بادی لطفا مثال بزنید.

در ضمن سایتتون با سایت استک اور فلو رغابت می کنه.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # امیر پهلوان صادق 1394-02-18 11:32
با استفاده از JavaScript به زیبایی می توانید این کار را انجام دهید: var elementToChange = document.getEle mentsByTagName( "body")[0];
elementToChange .style.cursor = "url('cursor url with protocol'), auto";

یا از طریق Jquery:$("html").css("cursor: url('/cursor url with protocol'), auto");
لطفاً به مثال زیر توجه فرمایید:
http://beyamooz.com/try_it_yourself/tryit.php?filename=trycss_cursor01
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان