نمایش یک تصویر به صورت بخشهای کوچک پشت سرهم

[p_adibi]

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

92156این عکس آرم یک شرکته که به صورت نقطه چین دراومده من می خوام این نقطه ها یکی یکی پشت سرهم ظاهر بشن چند راه به ذهنم رسید
یکی اینکه برای هر نقطه یک div تعریف کنم و با hide و show و settimeout نقطه ها رو یکی یکی پشت سرهم بیارم که نتیجه کار خوب درمیاد فقط مشکلش اینه که باید به تعداد نقطه ها یعنی 121 div تعریف کنم

یه راه دیگه اینکه از طریق image sprites عمل کنم که برای این کار هم باید 121 image یک پیکسلی تعریف کنم

یا از طریق clip:rect که باز برای اون هم باید image رو 121 بار تکرار کنم

آیا راهی هست که نیاز به تکرار image یا div ها نباشه؟

مثلا با javascript میشه چیزی شبیه alias برای image تعریف کرد که خود image رو یک بار تعریف کنیم اما بتونیم در ثانیه های مختلف css های متفاوت بهش بدیم بطوریکه css های قبلی هم از دست نره

با تشکر منتظر پاسختان هستم

[alitavakoli]

دوست عزیز راه حلی که پیشنهاد میکنم میتونه به این صورت باشه که ابتدا پیکسل های عکس رو با jquery بگیرید و داخل یک آرایه بریزید و در ادامه پیکسل ها رو یکی یکی تو خروجی نشون بدید.

[p_adibi]

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

[hamed_hossani]

http://www.greepit.com/wp-content/uploads/2012/07/imjqmosaic-jquery-plugin-for-creating-image-mosaic-patterns.jpg
http://www.greepit.com/2012/07/imjqmosaic-jquery-plugin-for-creating-image-mosaic-patterns/
شاید بدرد بخوره!

[p_adibi]

با تشکر از پاسختون
در سایتش نوشته باید بروزر html5 و css3 رو support کنه خب ممکنه کاربرهایی که سایتو می بینن بروزرشون اینها رو support نکنه

[p_adibi]

ابتدا پیکسل های عکس رو با jquery بگیرید و داخل یک آرایه بریزید و در ادامه پیکسل ها رو یکی یکی تو خروجی نشون بدید.

میشه بگید پیکسل های عکس رو چه جوری با jquery بگیرم؟

[plague]

پیکسل ها رو میشه باجاوا اسکریپت گرفت ولی بعید میدونم بشه با جی کوئری پیکسل ها رو نمایش / مخفی کرد

http://stackoverflow.com/questions/1041399/how-to-use-javascript-or-jquery-to-read-a-pixel-of-an-image
بهترین راه اینه که فلش یا گیف استفاده کنی یا Html5 رو چک کنی شاید همچین امکانی رو داشته باشه

[p_adibi]

با تشکر از راهنماییتون
من قبلا در همین سایت پرسیده بودم که یک طراح وب jquery بلد باشه کافیه لازم نیست flash بلد باشه؟و اکثرا جواب دادن flash رو به انقراضه و jquery ارجحه
حالا این یه نمونه که انجامش با flash راحتتر از jquery است پس باید برم flash هم یاد بگیرم

[ya30ien2]

منم فکر میکنم با فلش راحتر باشه حداقل برای کار فکر میکنم به کد نویسی احتیاجی نداره

[امید امرایی]

وقتی سواری هست سوار گالری شدن دو از ذهنه دوست گرامی
یه عکس GIF بسازید

[plague]

در این مورد فلش برتره ولی در کل اگه بخای مقایسه بکنی کاربرد های روزمره رو جی کوئری 99% پرکاربرد تره و به نظر من ارزش یادگیری نداره فلش حداقل یه طراح وب که میخاد کارشو راه بندازه
اونم بهتون درست گفتن که در حال انقراضه
شما میتونی این رو توی فوتوشاپ با فریم بندی و فرمت gif بسازی خیلی هم سادست

[p_adibi]

با تشکر از پاسختون
اگه بخوام در gif animator یا فتوشاپ اینو بسازم برای اینکه نقاط قهوه ای رنگ یکی یکی پشت سرهم بیان باید به تعداد نقاط فریم بسازم و در هر فریم یک نقطه جدید به نقاط قبلی اضافه کنم که میشه 121 فریم

راهش همینه یا راه بهتر با تعداد فریم کمتر داره؟

در ضمن عکسم این بود92292

با تشکر منتظر پاسختون هستم

[plague]

بله شما باید برای هر نقطه یک فریم بسازید
برای اینکه فریم ها کمتر بشه پیشنهاد میکنم در هر فریم چند نقه رو ظاهر کنید ولی این چند نقطه در کنار هم نباشند مثلا یک نقطه از گوشه سمت چپ و بالا
یک نقطه هم از گوشه سمت راست و پایین
اینها از دو نقطه مخالف شروع به ظاهر شدن بکنن تا در وسط به هم برسن هم فریم کمتر میشه هم از نظر نمایش زیباست