shayan

ثابت ماندن موقعیت یک عنصر

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

سلام

من تو طراحی قالبی که اخیرا انجام دادم ، برای صفحه اصلی قالبم یه بردر در نظر گرفتم

و یه عنصر هم تعریف کردم و اون رو با استفاده از position:fixed به کناره بردر ثابت کردم با این هدف که میخوام اون عنصر روی بردر من به صورت ریلی با حرکت اسکرول متحرک بشه

خب؟

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

با توجه به این که دستور position:fixed نسبت به تگ body موقعیت خودشو میسنجه ، چه کار کنم که تحت هیچ شرایطی از جاش تکون نخوره و با اسکرول کردن هم حرکت کنه

عکس اون عنصر رو پیوست کردم

ممنون

post-813-0-69356600-1413209533_thumb.png

0

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


لینک به پست

سلام

top و left رو 0 کنید:


position:fixed;
top:0;
left:0;

0

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


لینک به پست

خب اینطوری که میچسبه به بالاب سمت چپ صفحه

من میخوام به صورت ریلی روی بردر حرکت کنه و هیچ تغییری نکنه

چه با مانیتور های بزرگ و کوچک و چه با زوم این و زوم اوت کردن

آدرس آنلاین

http://www.yaranenamaz.com

0

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


لینک به پست

http://jsfiddle.net/A5f4r/10/

بیا عزیز. یه مورد ساده

1

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


لینک به پست

من دقیقا متوجه نمونه ای که زحمتش رو کشیدید نشدم!

چون هیچ عکسی لود نشده

آیا اون کد های جاوا اسکریپت هم تاثیر داره؟

شما از position: absolute; ؟!

میشه یکم توضیح بدید

ممنون

0

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


لینک به پست

یه خورده اسکرول بزن عکسش میاد.

0

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


لینک به پست

والا من که چیزی نمیبینم :D

خب مهم نیست

بی زحمت شما بنده رو راهنمایی کنید که چطور همین بلا رو سر سایت خودم بیارم

سپاس

;)

0

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


لینک به پست
والا من که چیزی نمیبینم :D خب مهم نیست بی زحمت شما بنده رو راهنمایی کنید که چطور همین بلا رو سر سایت خودم بیارم سپاس ;)

عزیزم جوابت رو که دادن!

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

به عنصرت id="aerobot" بده و فایل یه کلاس هم که بازم توی همون لینک هست بده کارت حل میشه.

1

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


لینک به پست

ارسال شده در (ویرایش شده)

منظور شما این نتیجه هست؟!!!

دقیقا کدهای شما رو استفاده کردم تو این کد

بررسی بفرمایید

عکسش رو عوض کردم و پیوست کردم


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>scroll</title>
<script>
var img = document.getElementById("aerobot");
window.onscroll = function () {
var bodyHeight = parseInt(getComputedStyle(document.body).height, 10);
var scrollLimit = bodyHeight - window.innerHeight;
var scrollTop = document.body.scrollTop;
var scrollPCT = (scrollTop / (scrollLimit / 100)) / 100;
img.style.top = bodyHeight * scrollPCT - img.offsetHeight + "px";
}
</script>
<style>
body {
height: 900px;
margin: 0;
padding: 0;
}
img {
width: 500px;
height: 500px;
position: absolute;
top: -50px;
right: 0;
}
</style>
</head>
<body>
<img id="aerobot" src="no photo.png" />
</body>
</html>

post-813-0-87914100-1413487135_thumb.png

ویرایش شده در توسط shayan
0

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط prooshe
      سلام خسته نباشید.
      من بدون فعالسازی ssl و نصب افزونه از قسمت تنظیمات وردپرسم آدرس سایتم را از http به https تغییر دادم الان دیگه نه سایتم بالا میاد نه دسترسی به مدیریتم دارم تا دوباره ویرایش کنم لطفا راهنمایی کنید؟
    • توسط samadionline
      سلام خدمت شما عزیزان
      چطوری میشه در وردپرس مثل جوملا برای کاربران گروه و سطوح دسترسی تعریف کرد؟
      و همچنین اینکه در جوملا در تنظیمات میشد صفحه آفلاین تعریف کرد و کاربران با لاگین کردن وارد صفحه اصلی سایت میشدند در وردپرس چطور میشه این کار رو انجام داد؟
      تشکر می کنم اگر کسی سر در میاره یه توضیح مختصر بده
    • توسط ashkan91
      با سلام و خسته نباشید
      دوستان کسی میدونه چطور میشه فیلد ایمیل رو از تو فرم تسویه حساب ووکامرس غیرضروری کرد؟ (بدون استفاده از افزونه) یکی از دوستان این لینک رو فرستادن اما نمیدونم کدام تکه کد از این صفحه را میبایست درون کدهای سایت قرار بدم که مشکل حل بشه؟
      https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/#example-make-phone-number-not-required
    • توسط aiinaz
      سلام دوستان 
       برای فونت من از @font face استفاده کردم تا فونتی که لازم دارم اعمال بشه اما نمی دونم چرا هر دفعه که صفحه رفرش میشه برای چند ثانیه فونت تغییر میکنه؟!!!! از نظر ادرس دهی هم درست انجام دادم و بعضی از فونت ها کلا اعمال نمیشه با اینکه روی سیستمم دارم؟!!!
    • توسط seosec
      سلام دوستان وقت بخیر ما یک سایت داریم قبلا توسط یک نفر طراحی شده و دگ پشتیبانی نمیشه.میخاییم خودمان پشتیبانی را انجام بدیم قصد داریم افزونه ووکامرس از ساست ژاکت بخریم فقط نمیدوینم با قالب ما سازگار هست یا نه؟اسم قالب سایت هم نمیدونیم!! سایت ما در زمینه اموزش امنیت اطلاعات میباشد!کسی میتونه راهنمایی کنه؟؟ ادرس سایت seosec.ir