محسن عواطفی 121 ارسال شده در مهر 97 گزارش بازنشر ارسال شده در مهر 97 سلام نمونه کد لینک زیر رو میخوام در سایتم جاگذاری کنم اما نمیدونم چطور ( کد مربوط به چسبان کردن سایدبار از نوع هوشمنده) https://codepen.io/perminder-klair/pen/tdzue اگه بلدید لطفا راهنمایی کنید و اگه آموزشی سراغ دارید ( که فارسی باشه ) لطفا معرفی کنید... نقل قول لینک به ارسال
فرشاد گوهری 1681 ارسال شده در مهر 97 گزارش بازنشر ارسال شده در مهر 97 در ۱ ساعت قبل، پویه گفته است : سلام نمونه کد لینک زیر رو میخوام در سایتم جاگذاری کنم اما نمیدونم چطور ( کد مربوط به چسبان کردن سایدبار از نوع هوشمنده) https://codepen.io/perminder-klair/pen/tdzue اگه بلدید لطفا راهنمایی کنید و اگه آموزشی سراغ دارید ( که فارسی باشه ) لطفا معرفی کنید... سلام این دوتا کد رو داخل هدر بذارید: <script> jQuery( document ).ready(function() { console.log( "document ready!" ); var jQuerysticky = jQuery('.sticky'); var jQuerystickyrStopper = jQuery('.sticky-stopper'); if (!!jQuerysticky.offset()) { // make sure ".sticky" element exists var generalSidebarHeight = jQuerysticky.innerHeight(); var stickyTop = jQuerysticky.offset().top; var stickOffset = 0; var stickyStopperPosition = jQuerystickyrStopper.offset().top; var stopPoint = stickyStopperPosition - generalSidebarHeight - stickOffset; var diff = stopPoint + stickOffset; jQuery(window).scroll(function(){ // scroll event var windowTop = jQuery(window).scrollTop(); // returns number if (stopPoint < windowTop) { jQuerysticky.css({ position: 'absolute', top: diff }); } else if (stickyTop < windowTop+stickOffset) { jQuerysticky.css({ position: 'fixed', top: stickOffset }); } else { jQuerysticky.css({position: 'absolute', top: 'initial'}); } }); } }); </script> <style> .container { width: 1000px; position: relative; } .header { clear: both; margin-bottom: 10px; border: 1px solid #000000; height: 90px; } .sidebar { float: left; width: 350px; border: 1px solid #000000; } .content { float: right; width: 640px; border: 1px solid #000000; height: 800px; } .footer { clear: both; margin-top: 10px; border: 1px solid #000000; height: 820px; } </style> پن1: میتونید کد استایل رو به جای هدر داخل همون فایل استایل قالبتون بذارید (بدون تگ باز و بستهی style) پن2: واسه استفاده از این کدی که گذاشته بودید باید کتابخانه jQuery داخل قالبتون فراخوانی شده باشه (که احتمالا شده، چون خیلی از قالبا و پلاگینا بش احتیاج دارن) بعد باید کلاس sticky رو به اون سایدباری که میخواید چسبان بشه اضافه کنید. در مرحلهی آخر هم باید کد زیر رو در اون جایی قرار بدید که میخواید سایدبار متوقف بشه (مثلا اگر میخواید قبل از رسیدن به فوتر متوقف شه باید کد رو بالای فوتر بذارید) <div class="sticky-stopper"></div> فقط توجه داشته باشید من این موارد رو دقیقا بر اساس همون آدرسی گفتم که لینکشو گذاشته بودید، امتحان نکردم ببینم کار میده یا نه. راحتتر بود اگه از پلاگینهای خود وردپرس استفاده میکردین. 1 نقل قول لینک به ارسال
محسن عواطفی 121 ارسال شده در مهر 97 مالک گزارش بازنشر ارسال شده در مهر 97 در 35 دقیقه قبل، فرشاد گوهری گفته است : بعد باید کلاس sticky رو به اون سایدباری که میخواید چسبان بشه اضافه کنید. ممنون ولی این یدونه رو متوجه نشدم... در 36 دقیقه قبل، فرشاد گوهری گفته است : پن1: میتونید کد استایل رو به جای هدر داخل همون فایل استایل قالبتون بذارید (بدون تگ باز و بستهی style) میتونم اون دو تا کد بالا رو به جای هدر تو style بزارم؟ نقل قول لینک به ارسال
فرشاد گوهری 1681 ارسال شده در مهر 97 گزارش بازنشر ارسال شده در مهر 97 در 2 ساعت قبل، پویه گفته است : ممنون ولی این یدونه رو متوجه نشدم... خب سایدبار شما یه کلاس داره دیگه، شما باید این کلاس استیکی رو هم به سایدبارتون اضافه کنید (به اون سایدباری که میخواید فیکس بشه) مثلا فرض کنید اینجوری: <div class="sidebar sticky"></div> در 2 ساعت قبل، پویه گفته است : میتونم اون دو تا کد بالا رو به جای هدر تو style بزارم؟ فقط کد دومی رو میتونید داخل فایل استایل بذارید (باید style رو از اول و آخر کد حذف کنید) نقل قول لینک به ارسال
محسن عواطفی 121 ارسال شده در مهر 97 مالک گزارش بازنشر ارسال شده در مهر 97 در ۱ ساعت قبل، فرشاد گوهری گفته است : خب سایدبار شما یه کلاس داره دیگه، شما باید این کلاس استیکی رو هم به سایدبارتون اضافه کنید (به اون سایدباری که میخواید فیکس بشه) مثلا فرض کنید اینجوری من میخوام دو تا سایدبارم فیکس بشه ددر ضمن نمیدونم که این کد رو باید چجوری و کجا بزارم؟ نقل قول لینک به ارسال
فرشاد گوهری 1681 ارسال شده در مهر 97 گزارش بازنشر ارسال شده در مهر 97 در 1 دقیقه قبل، پویه گفته است : من میخوام دو تا سایدبارم فیکس بشه ددر ضمن نمیدونم که این کد رو باید چجوری و کجا بزارم؟ خب اینجوری باید دست ببرید توی کدهای قالب که شخصا توصیه نمیکنم بتون. شما به جای اینکه از کد استفاده کنید چرا پلاگین نصب نمیکنید؟ https://wordpress.org/plugins/q2w3-fixed-widget/ این پلاگین کل این چیزی که شما میخواید رو داره، حتی خیلی کامل تر. 1 نقل قول لینک به ارسال
محسن عواطفی 121 ارسال شده در مهر 97 مالک گزارش بازنشر ارسال شده در مهر 97 در 37 دقیقه قبل، فرشاد گوهری گفته است : خب اینجوری باید دست ببرید توی کدهای قالب که شخصا توصیه نمیکنم بتون. شما به جای اینکه از کد استفاده کنید چرا پلاگین نصب نمیکنید؟ https://wordpress.org/plugins/q2w3-fixed-widget/ این پلاگین کل این چیزی که شما میخواید رو داره، حتی خیلی کامل تر. از این پلاگین استفاده کردم ، ولی خب اون فقط یک سری ویجت هارو فیکس میکنه که اون چیزی که میخوام نیست ، در ضمن در موبایل هم خیلی آزار دهندس و جلوی دید کاربر رو بدجور میگیره نقل قول لینک به ارسال
پست های پیشنهاد شده
به گفتگو بپیوندید
هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .