استفاده از تگ marquee

چهارشنبه 19 فوریه 14

نحوه استفاده از تگ marquee

نحوه استفاده از تگ marquee

استفاده از این تگ بسیار آسان است، کافی است متن مورد نظر خود را به صورت زیر تنظیم کنید.

<marquee>متن متحرک</marquee>

ویژگی behavior

مثال بالا، تنها حالت پیش فرض یک متن متحرک را ایجاد می کند، اما اگر بخواهیم تنظیمات بیشتری بر روی نحوه حرکت، سرعت، رنگ پس زمینه و … اعمال کنیم، باید از عناصر بیشتری استفاده کنیم، یکی از این عناصر، behavior است، این ویژگی در واقع نوع اسکرول را نشان می دهد و دارای سه مقدار است:
alternate: متن متحرک با برخورد به انتهای بلاک، در جهت عکس و به صورت پینگ پونگی حرکت می کند.
scroll: متن از یک سمت وارد شده و از سمت دیگر بلاک، خارج می شود.
slide: متن از یک سمت وارد شده و در سمت دیگر، در انتهای بلاک، متوقف می شود.
به مثال زیر توجه کنید.

<marquee behavior="slide">متن متحرک</marquee>

ویژگی bgcolor

تگ marquee را می توان با ویژگی bgcolor به صورت سفارشی تری تنظیم کرد، همانطور که از نام این عنصر مشخص است، از آن برای تعیین رنگ پس زمینه استفاده می شود که مقادیر کدهای هگز را در خود جای می دهد.

<marquee behavior="slide" bgcolor="#CCCCCC">متن متحرک</marquee>

ویژگی dir

اگر متن شما به زبان فارسی یا در کل به زبان هایی است که از راست به چپ نوشته می شوند، باید از ویژگی dir و مقادیر rtl در آن استفاده کنید تا چینش متن به نحو صحیح نشان داده شود، dir دو مقدار ltr (برای حروف انگلیسی و از چپ به راست) و rtl (برای حروف فارسی و از راست به چپ) دارد.

<marquee behavior="slide" bgcolor="#CCCCCC" dir="rtl">متن متحرک</marquee>

ویژگی direction

از direction برای تعیین جهت اسکرول استفاده می شود، چهار جهت اصلی یعنی بالا، پائین، چپ و راست را می توان به صورت مقادیر در نظر گرفت.
down: پائین
up: بالا
left: چپ
right: راست
به مثال زیر توجه کنید.

<marquee behavior="slide" bgcolor="#CCCCCC" dir="rtl" direction="down">متن متحرک</marquee>

ویژگی height و width

برای تعیین ارتفاع و عرض بلاکی که متن متحرک را نشان می دهد، از دو عنصر height و width با مقادیری به پیکسل یا به صورت درصد استفاده می کنیم.

<marquee behavior="scroll" bgcolor="#CCCCCC" dir="rtl" direction="left" height="25" width="200">متن متحرک</marquee>

ویژگی loop

برخی مواقع ممکن است بخواهیم تعداد دفعات اسکرول ها را در چند دور محدود کنیم، بدین منظور از ویژگی loop و یک عدد به عنوان مقادیر استفاده می کنیم، مقادیر 1- در واقع همان حالت پیش فرض است.

<marquee behavior="scroll" bgcolor="#CCCCCC" dir="rtl" direction="left" height="25" width="200" loop="-1">متن متحرک</marquee>

ویژگی scrollamount

برای تعیین سرعت اسکرول از لحاظ طی کردن تعداد پیکسل در هر فِرم، از ویژگی scrollamount با یک عدد (معمولا بین 1 تا 10) به عنوان مقادیر استفاده می شود، هر چه عدد کوچکتر باشد، سرعت اسکرول و تعداد پیکسل کم تر است و هرچه عدد بزرگتر باشد، سرعت اسکرول و تعداد پیکسل در هر فِرم بیشتر است.

<marquee behavior="scroll" bgcolor="#CCCCCC" dir="rtl" direction="left" height="25" width="200" loop="-1" scrollamount="3">متن متحرک</marquee>

ویژگی scrolldelay

ویژگی scrolldelay در واقع تکمیل کننده scrollamount است، از scrolldelay برای تعیین وقفه ها (به میلی ثانیه) استفاده می شود، برای ایجاد بهترین حالت اسکرول، بهتر است برای هر دو عنصر، مقادیر یک را در نظر بگیرید.

<marquee behavior="scroll" bgcolor="#CCCCCC" dir="rtl" direction="left" height="25" width="200" loop="-1" scrollamount="1" scrolldelay="1">متن متحرک</marquee>

کنترل اسکرول متن با جاوا اسکریپت

علاوه بر مواردی که تا این لحظه گفتیم، در marquee از دو ویژگی ساده، مبتنی بر جاوا اسکریپت نیز می توانیم برای کنترل حرکت متن، زمانی که ماوس خود را روی آن می بریم، استفاده کنیم، ویژگی onmouseover و onmouseout سبب می شوند که کنترل رفتار بلاک را در هنگامی که کاربر ماوس خود را جهت کلیک کردن بر روی باکس متحرک می برد، در اختیار داشته باشیم، به اینصورت که پس از بردن ماوس، متن متحرک متوقف شود و با خارج شدن ماوس، دوباره به حرکت اسکرولی خود، ادامه دهد؛ بدین منظور باید مقادیر زیر را برای onmouseover و onmouseout تنظیم کنیم.

<marquee behavior="scroll" bgcolor="#CCCCCC" dir="rtl" direction="left" height="25" width="200" loop="-1" scrollamount="1" scrolldelay="1" onmouseover="this.scrollAmount=0" onmouseout="this.scrollAmount=1">متن متحرک</marquee>

دقت کنید که مقادیر داخل onmouseover و onmouseout به حروف بزرگ و کوچک حساس هستند.منبع : وبگو (آموزش برنامه نویسی و مهارت های وب )

طراحی سایت اصلی ترین حرفه در شرکت فناوی اطلاعات آنفایو است. مهمترین دستاورد طراحی سایت باید شناساندن نام تجاری ، معرفی خدمات و محصولات شما باشد که رسیدن به این مهم با رعایت استانداردهای جهانی طراحی سایت که شامل بهینه سازی وب سایت بر اساس الگوریتم موتورهای جستجو ، در کنار داشتن ظاهری زیبا فراهم می شود. در دنیای مجازی امروز و عصر پیشرفته ارتباطات برای صاحبان سازمان ها ، نهادهای دولتی و صاحبان مشاغل وکسب وکار آزاد داشتن یک وب سایت امری ضروری است .از مزایای داشتن سایت معرفی ، اطلاع رسانی ، بازاریابی و قابلیت های نوین تبلیغاتی میباشد .کاربران میتوانند از هر نقطه دنیا فقط با یک کلیک به شما دسترسی داشته باشند.

شرکت آنفایو خدمات طراحی سایت (طراحی وب) خود را، با توجه به نیازهای کارفرمایان، نوع فعالیت و متناسب با بودجه در نظر گرفته شده برای طراحی سایت (طراحی وب) در نظر می گیرد. آنفایو با بهره گیری از بهتریت متخصصین حرفه ای برنامه نویسی ، داشتن تیم تخصصی طراحی سایت ، تسلط به علوم روز دنیای کامپیوتر و اینترنت و مشاوره رایگان وپشتیبانی ۲۴ ساعته آمادگی خود را برای طراحی وب سایت های دولتی ، سازمانی ، شرکتی وشخصی با تلفیق هنر گرافیک دیجیتالی و جدیدترین تکنیک های برنامه ویسی اعلام میدارد .افزایش آمار ، دسترسی ساده کاربران و سرعت وب سایت خود را به شرکت طراحی سایت و قالب وردپرس آنفایو بسپارید.

ادامه مطلب