mohammad425
سه شنبه 01 دی 1394, 15:14 عصر
http://forum.ayfer.ir/uploads/monthly_2015_12/56741004258a1_-1forum.ayfer.ir.PNG.336410877b176666c10999167acd97 c7.PNG
در این آموزش قصد داریم تا تگ آپلود فایل در html که با کد زیر ساخته میشود را به صورت فلت استایل بندی نماییم:
<inputtype="file"/>
ما در اینجا ابتدا اومدیم و طرح کلی رو که میخواستیم رو پیاده سازی کردیم و سپس تگ آپلود رو با position: absolute; روی طرح خودمون انداختیم و بعد با قرار دادن مقدار opacity به 0 اون رو از دید کاربر مخفی کردیم.
به این ترتیب وقتی کاربر روی طرح ما کلیک کنه درواقع روی تگ آپلود کلیک کرده و میتونه فایلهاشو به راحتی آپلود کنه.
دانلود فایل ها و ادامه ی آموزش: (http://forum.ayfer.ir/topic/13-آموزش-استایل-دهی-به-سبک-فلت-برای-تگ-آپلود-فایل/#comment-64)
http://forum.ayfer.ir/uploads/monthly_2015_12/dl-btn.png.7044da9f0baa81dcd6c82567a23a6946.png (http://forum.ayfer.ir/topic/13-آموزش-استایل-دهی-به-سبک-فلت-برای-تگ-آپلود-فایل/#comment-64)
در این آموزش قصد داریم تا تگ آپلود فایل در html که با کد زیر ساخته میشود را به صورت فلت استایل بندی نماییم:
<inputtype="file"/>
ما در اینجا ابتدا اومدیم و طرح کلی رو که میخواستیم رو پیاده سازی کردیم و سپس تگ آپلود رو با position: absolute; روی طرح خودمون انداختیم و بعد با قرار دادن مقدار opacity به 0 اون رو از دید کاربر مخفی کردیم.
به این ترتیب وقتی کاربر روی طرح ما کلیک کنه درواقع روی تگ آپلود کلیک کرده و میتونه فایلهاشو به راحتی آپلود کنه.
دانلود فایل ها و ادامه ی آموزش: (http://forum.ayfer.ir/topic/13-آموزش-استایل-دهی-به-سبک-فلت-برای-تگ-آپلود-فایل/#comment-64)
http://forum.ayfer.ir/uploads/monthly_2015_12/dl-btn.png.7044da9f0baa81dcd6c82567a23a6946.png (http://forum.ayfer.ir/topic/13-آموزش-استایل-دهی-به-سبک-فلت-برای-تگ-آپلود-فایل/#comment-64)