• اطلاعیه ها

    • Saeed Fard

      آگهی استخدام برنامه نویس و پشتیبان وردپرس   13/12/95

      آگهی استخدام برنامه نویس و پشتیبان وردپرس
       
      2 نفر پشتیبان سایت وردپرسی
      ⁃ آشنا به برنامه نویسی قالب و پلاگین وردپرس 
      ⁃ توانایی راه اندازی سایت، قالب و افزونه های وردپرسی 
      ⁃ توانایی برنامه نویسی PHP در حد متوسط 
      ⁃ اطلاعات عمومی وب بالا 
      ⁃ توانایی پاسخگویی نوشتاری به سوالات انگلیسی با گرامر ساده 
      ⁃ آشنایی با HTML/CSS/jQuery 
      ⁃ دارای روحیه کار تیمی، خلاق، مسئولیت‌پذیر و پشتکار بالا ——— ۲ نفر برنامه نویس قالب وردپرس
      ⁃ تسلط به HTML/CSS/jQuery و Bootstrap
      ⁃ توانایی تبدیل HTML به قالب وردپرس
      ⁃ توانایی برنامه نویسی PHP و پلاگین نویسی وردپرس در حد متوسط
      ⁃ آشنایی به اصول سئو 
      ⁃ آشنایی با Git/subversion مزیت محسوب می‌شود.
      ⁃ دارای روحیه کار تیمی، خلاق، مسئولیت‌پذیر و پشتکار بالا ——— ۱ نفر طراح UI/UX
      ⁃ طراحی خلاقه وب سایت
      ⁃ طراحی با جدیدترین استایل‌های طراحی سایت
      ⁃ مسلط به تایپوگرافی انگلیسی و طراحی وب سایت انگلیسی
      ⁃ انتقاد پذیری و قبول بازخوردهای تیم و مشارکت با دیگر اعضاء تیم برای سرعت بخشیدن به فرایند انجام پروژه
      ⁃ آشنایی و درک HTML/CSS/jQuery
      ⁃ دارای روحیه کار تیمی، خلاق، مسئولیت‌پذیر و پشتکار بالا
      ⁃ امکان همکاری به صورت پروژه‌ای و دورکاری در این موقعیت شغلی فراهم است ——— مزایای کار در مجموعه گرودیا
      ⁃ تجربه ناب کار در سطح یک جهانی
      ⁃ محیط کار بسیار دوستانه و آرام
      ⁃ پرداخت های مناسب و سر وقت
      ⁃ کلاس های آموزشی داخلی به جهت بالا بردن دانایی و توانایی همه اعضا   از علاقه‌مندان و نیازمندان تقاضا می‌شود لطفا رزومه کاری خود را با قید موقعیت شغلی به ایمیل info@grodea.co ارسال نمایید.
    • Morteza

      سال 1396 خورشیدی مبارک   29/12/95

      سال 1396 خورشیدی مبارک
Ghasem Paran

لود تصاویر با scroll شدن صفحه

19 پست در این موضوع قرار دارد

سلام

چطوری میشه کاری کرد که تصاویر مثل این سایت نمایش داده بشن ؟


http://demo.tempfa.org/multinews

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

ممنون

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

با تکنولوژی Lazy Load سرچ کنید!

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

به وسیله جی کوئری


$(document).ready(function() {
$(window).scroll(function() {
$("img").each(function() {
var data = $(this).attr("data-img");
var src = "http://yoursite.com/loading.gif";
var offset = $(this).offset();
var scroll = $(window).scrollTop();
if (scroll >= offset.top) {
$(this).attr("src", data);
} else
{
$(this).attr("src", src);
}
});
});
})

و تصاویر باید به صورت


<img src="http://yoursite.com/loading.gif" data-img="http://yoursite.com/image.jpg">

قرار بگیرند یعنی همه تصاویر فایل لودینگ را نمایش بدهند و نشانی اصلی تصویر در data-img باشد

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

به وسیله جی کوئری


$(document).ready(function() {
$(window).scroll(function() {
$("img").each(function() {
var data = $(this).attr("data-img");
var src = "http://yoursite.com/loading.gif";
var offset = $(this).offset();
var scroll = $(window).scrollTop();
if (scroll >= offset.top) {
$(this).attr("src", data);
} else
{
$(this).attr("src", src);
}
});
});
})

و تصاویر باید به صورت


<img src="http://yoursite.com/loading.gif" data-img="http://yoursite.com/image.jpg">

قرار بگیرند یعنی همه تصاویر فایل لودینگ را نمایش بدهند و نشانی اصلی تصویر در data-img باشد

خیلی خیلی ممنون آقا ایمان

فقط یک سوال ، وجود data-img در تگ img ، در html5 با قوانین w3 سازگاره ؟

ویرایش شده در توسط Ghasem Paran

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

آقا ایمان کار نمیکنه

post-2969-0-31120700-1407778563_thumb.jp

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

با تکنولوژی Lazy Load سرچ کنید!

اسکریپت دیگه ای نیست ؟

با این که داخل localhost اجرا میشه ، عکس ها چند دقیقه طول میکشه تا لود بشه :huh:

ظاهر با پلاگین jquery scrollbar مشکل داره :(

ویرایش شده در توسط Ghasem Paran

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

لود تصاویر به حجمشون بستگی داره در حالت عادی هم همین زمان رو می بره ولی چون زیر اسکرول صفحه است کاربر نمی بینه

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


$(document).ready(function() {
$(window).scroll(function() {
$("img").each(function() {
var data = $(this).attr("data-img");
var src = "http://yoursite.com/loading.gif";
var offset = $(this).offset();
var offset_top = parseInt(offset.top)/2;
var scroll = $(window).scrollTop();
if (scroll >= offset_top) {
$(this).attr("src", data);
} else
{
$(this).attr("src", src);
}
});
});
})

این رو تست کنید

data-img جزو اترهای مجاز html5 است.

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

تصاویر سایزشون 70*70 هست و حجمشون کمتر از 50 کیلوبایت

پلاگین

Lazy Load عالیه ، اما مثل با پلاگین های دیگه ای که استفاده کردم مشکل داره

آقای فخار کد شما هم با پلاگین

jquery scrollbar مشکل داره.

:(

و یه چیز دیگه این که کد شما با اسکرول با سمت پایین تصاویر لود میشن و با اسکرول به سمت بالا تصویر برداشته میشن

ویرایش شده در توسط Ghasem Paran

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

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

شما اگر افزونه

jquery scrollbar را دارید باید همون رو ویرایش کنید اصولا دوتا کد window.scroll همزمان خونده نمی شند

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

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

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

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

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

شما اگر افزونه jquery scrollbar را دارید باید همون رو ویرایش کنید اصولا دوتا کد window.scroll همزمان خونده نمی شند

چطوری ؟ میشه بیشتر راهنمایی کنید ؟ :wub:

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

بعد کلی جستجو یه کد پیدا کردم و کمی تغییرش دادم.


(function($){
$(window).load(function(){
$("img.lazy").show().lazyload({
effect : "fadeIn",
failure_limit : 10
});
$("body").mCustomScrollbar({
axis:"y",
autoHideScrollbar:true,
scrollButtons:{enable:true},
theme:"light-thick",
callbacks:{
whileScrolling:function(){ $("img.lazy").lazyload(); }
}
});
});
})(jQuery);

الان 2 تا پلاگین هیچ مشکلی با هم نداره و نمایش داده میشوند.

فقط این که scrollbar سرعتش اومده پایین و هنگام اسکرول تیک میزنه صفحه. کمک !!! :(

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

این کد شما به تنهاییی که کاری انجام نمی ده این باید به یک کتابخانه مثل lazy متصل بشه که با توجه به دستکاری اسکرولر طبیعتا سرعت رو می آره پایین و روش حرفه ای برای سایتهای بزرگ نیست

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

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

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

کجایه

اسکرولر را

باید تغییر داد ؟

اصلا قابل خوندن نیست فایل


http://jsfiddle.net/6odvgh9p/

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

این فایل min است باید فایل اصلیش را دانلود و ویرایش کنید

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

این فایل min است باید فایل اصلیش را دانلود و ویرایش کنید


http://jsfiddle.net/mnu2fra3/

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

همش رو باید ویرایش کنید :D

یک فرصت آزاد می خواد که آدم بشینه توابع رو بخونه و ببینه کار هر کدوم چیه اونوقت بر اساس offset.top تصاویر بهشون مقدار اضافه کنه

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

همش رو باید ویرایش کنید :D

یک فرصت آزاد می خواد که آدم بشینه توابع رو بخونه و ببینه کار هر کدوم چیه اونوقت بر اساس offset.top تصاویر بهشون مقدار اضافه کنه

:D :D

آقا ایمان نظرتون در مورد این که بیخیال اسکرولر بشم چیه ؟

ارزش نداره اگه بخوایم تغییرش بدیم ، ممکنه ورژن جدیدتر هم بیاد.

سنگین ترین فایل صفحه هم همین اسکرولر هست

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

من که عرض کردم

 روش حرفه ای برای سایتهای بزرگ نیست

کمتر سایت بزرگ و محبوبی را می تونید پیدا کنید که از اینجور ابزار توش باشه مگر اینکه از یک هاست اختصاصی خیلی قدرتمند استفاده کنه و به نوعی بخواد قدرت سرورش را به نمایش بگذاره

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

حذفش کردم.

آقا ایمان و امین ، خیلی ممنون بابت راهنمایی ها و کمک هاتون :wub:

به اشتراک گذاری این پست


لینک به پست
به اشتراک گذاری در سایت های دیگر

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط sajjadmp
      بعد از مدت ها سلام .
      یه فکری به نظرم رسیده که به درد من میخوره میخوام ببینم برنامه نویسای عزیز میتونن عملیش کنن یا نه ، البته بعید میدونم اینجا به نتیجه برسم .
      میخوام ببینم میشه با کد نویسی قابلیتیو به وجود اورد که توی نوشته ها بعد از اسکرول کردن و گذشتن از یک پاراگراف ، اسکرول بار یه مکثی بکنه .
      یه قابلیتی شبیه lazy load ولی با این تفاوت که اینجوری کل متن به یه اسلایدر تبدیل میشه .
      اگه با کدنویسی میشه لطفا راهنمایی کنید به نظر من که جالبه .
      با تشکر
    • توسط عمارگراف
      سلام دوستان
      وقتتون بخیر
      یه مسئله ای ذهنمرو مشغول کرده.
      میخوام یه کدی داشته باشم برای اسکرول بی نهایت - infinite scroll مثل سایتهای اجتماعی(fb - tw) که وقتی کاربر اسکرول میکنه به پایین بقیه تصاویر و مطالب لود بشه.
      اما نکته خاصش اینجاشت که میخوام این کد رو برای محتوای داخل یه مطلب بنویسم.
      یعنی :
      یه مطلب دارم که داخلش یه گالری دارم با 1000عکس.اما در مرحله اول فقط مثلا 10 تا تصویر لود بشن.بعدش که اسکرول اومد پایین 10 تا 10 تا تصاویر بعدی لود بشن.
      نکته دوم اینکه همون صفحه میخوام قابلیت فیلتر هم داشته باشه.
      یعنی :
      بعنوان مثال من تصاویر شاخص چندین مطلب رو لود میکنم توی یه صفحه ، میخوام بعدش بتونم به صورت ای جکس نتیجه رو فیلتر کنم.دقیقاً مث این سایت : زاهدنژاد
      پس شد دو نکته :
      1-چجوری اسکرول بی نهایت رو روی صفحات و مطالب اجرا کنم؟
      2-چجوری نتایج کوئری های وردپرس رو با ای جکس فیلتر کنم؟ (باید لینک دسته رو اون بالا بذارم و نتیجه رو توی content نمایش بدم؟)
      ممنون
      یا علی