hide ...show....toggle


hide :  این تابع باعث میشه یک المان از دید مخفی بشه

show :  این تابع باعث میشه یک المان که از قبل مخفی بوده نمایش داده بشه

toggle  این تابعد بررسی میکنه ببینه که المان مخفیه یا در حال نمایش ...اگه مخفی بود اون رو نمایش میده و اگرم در حال نمایش بود اون رو مخفی می کنه

تموم این سه تابع یک ارگومان اختیاری دارن واسه ی زمان که بر حسب میلی ثانیه است

یک مثال :

<div id="show">
    show me
</div>
<div id="hide" style="display:none">

    hidden me
</div>
<div id="toggle">
    show or hidden !
</div>
<a onclick="$('#show').hide(1000)">hide div1</a><br>
<a onclick="$('#hide').show(1000)">show div2</a><br>
<a onclick="$('#toggle').toggle(1000)">show and hidden</a>

با کلیک روی لینک اولی دیو اولی مخفی میشه

با کلیک روی دومی دیو دومی که مخفی هست نمایش داده میشه

و با کلیک روی سومی دیو مخفی میشه و با کلیک دوم نمایش داده میشه

....

اینم یه ذره بازی با جی کوئری

چشم های میرن و میان ... (وقت نداشتم وگرنه بیشتر روش کار می کردم


<div style="border: 1px #000000 solid;width: 200px;height: 200px;border-radius: 100%">
<div  id="cheshmak2" style="margin-right: 130px;margin-top: 70px; border: 1px #000000 solid;width: 50px;height: 50px;border-radius: 100%"></div>
<div id="cheshmak" style="border: 1px #000000 solid;width: 50px; margin-right: 30px; margin-top: -50px;height: 50px;border-radius: 100%"></div>

</div>
<script>
    setInterval(function(){$('#cheshmak').toggle(1000)},3000)
    setInterval(function(){$('#cheshmak2').toggle(1000)},3000)
</script>

 

توضیح خاصی نمیخاد فقط تابع setInterval یک حلقه ی زمانی به وجود میاره در این مثال هر 3 ثانیه دوتا دیو چشمک مخفی و بعد 3 ثانیه دوباره ظاهر میشن

۱۳۴۸/۱۰/۱۱ || in category : جی کوئری و جاواسکریپت