پلاگین جی کوئری تغییر استایل ToolTip + آموزش ساده
منظور از تولتیب ها, همان کادر های ساده و رنگ روشنی هستند که با قرار دادن موس بر روی آنها , پس از 1 ثانیه ظاهر میشوند و شرح مختصری از اون Object رو به ما میده .
این تولتیب ها با دادن اتربیوت title به یک تگ در html ساخته می شوند .
همانطور که میدانیم به صورت پیش فرض تولتیب ها دارای استایلی ساده می باشند .
با استفاده از این آموزش میتوانید این استایل را تغییر و از یکنواختی در بیاورید .
آموزش :
ابتدا باید فایل های مورد نیاز را از اینجا دانلود کنید و سپس در روت ( root ) سایت خود قرار دهید . ( منظور از روت , پوشه ی اصلی سایت شماست . مثلا در هاست های لینوکسی , در پوشه ی public_html و یا www )
نکته : کاملا بدیهی است که این آموزش , طریقه نصب پلاگین در روت سایت میباشد و اگر بخواهید جای فایل ها و پوشه هارو عوض کنید , باید آدرس دهی کدهایی که در ادامه آموزش خواهم داد رو هم به صورت مناسب عوض کنید .
حال در بالای صفحه و یا صفحات خود , کد زیر را در بین دو تگ <head> و <head/> قرار دهید .
<link rel="stylesheet" type="text/css" href="css/tooltipster.css"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.tooltipster.js"></script>
پس از این کار , کدهای زیر را در 2 خط مانده به آخر , یعنی قبل از دو تگ <html/> و <body/> قرار دهید .
<script type="text/javascript">
$(document).ready(function() {
$('*').tooltipster();
});
</script>
نکته : برای دادن این خاصت به هر تگی که دوست دارید , کافیست اتربیوت title را به آن تگ اضافه کنید . البته به دلیل از بین بردن شلوغی در وب سایت , بهتر است فقط به تگ های لینک و عکس این خاصیت را بدهید .
<a href="http://اسکریپت.com" title="اسکریپت دات کام<"ترفند و آموزش</a> <img src="test.jpg" title="اسکریپت دات کام">
پحش اختصاصی
گرداوری : وحید مجیدی
دانلود نمونه ی آماده :
[sdm_download id=”1728″ fancy=”0″]
دمت گرم داش.
خیلی آقایی.
سلام اقای مجیدی
من تمام مراحل رو به درستی انجام دادم اما متاسفانه کد نمایش داده نمی شه یعنی تولتیپ به صورت معمولی به نمایش در میاد
میشه کمک کنید
با تشکر
لطفا دمو رو بزارید تا ببینم
یه سوال داشتم این بکسی که تگ ها رو توش میذاری رو چطوری تو سایتمون بذاریم
باسلام . از افزونه crayon استفاده کنید
20*20=جیگرتو :D
قربونت داداش گلم