سعید شعبانی

تغییر مختصات یک المان absolute توسط jQuery

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

دوستان سلام

من یک المان را absolute کردم و با left موقعیتش را می خواهم تغییر بدم ولی نمی خواهم این کار به صورت ثابت انجام بشه. یعنی می خواهم مانند اسکرول بار ها باشه به این صورت که یک المان دیگر در صفحه ایجاد کنم و با حرکت دادن اون المان, left المان دیگر تغییر کند. به این صورت هم باشه که عرض المانی که absolute شده را شناسایی کنه و بعد به همون اندازه از left صفر شروع بشه تا left ی برابر با عرض المان absolute شده.

ببخشید یکم بد توضیح دادم

0

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


لینک به پست


<style type="text/css">
div {
display:block;
position:absolute;
}
</style>;
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
var width = $("div").width();
$("div").animate({
"left" : width
},300);
})
})
</script>
<button>button</button>
<div></div>

تست کنید

2

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


لینک به پست

خیلی متشکرم فقط چندتا سوال

div اولی داخل js برای چی هست؟ دومی برای چی؟

بعد این div که در آخر باز و بسته کردید برای چی هست؟


<div></div>

0

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


لینک به پست

div عنصریست که قرار است حرکت کند و button کلیدی که قرار است دستور حرکت را صادر کند

مفهوم کدهای js :


$(document).ready(function()

یعنی بعد از خواندن سند کد را اجرا کن


$("button").click(function() {

هر وقت عنصری با نام button (می تواند آی دی یا کلاس باشد) کلیک شد


var width = $("div").width();

به کلمه width مقداری برار عرض عنصر div بده


$("div").animate({
"left" : width
},300);

عنصر div را به صورت انیمیشن به به اندازه مقدار width و ظرف 300 میلی ثانیه (یک سوم ثانیه) به سمت چپ ببر

3

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


لینک به پست

جناب فخار خیلی متشکرم الان اینجا را ببینید مشکل چیه؟

0

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


لینک به پست

شما وقتی در html از table استفاده نکردی چرا در js به tr و td افکت دادی؟

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

http://jsfiddle.net/jaRTu/

2

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


لینک به پست

شما وقتی در html از table استفاده نکردی چرا در js به tr و td افکت دادی؟

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

http://jsfiddle.net/jaRTu/

بله تقریبا همچین چیزی می خواهم ولی یک مشکل هست : عرض را باید به صورت دستی برای کلاس block وارد کنم (به دلیل اینکه بعدا این عرض کم یا زیاد میشه می خواهم تا عرض را خودش زیاد کنه به طوری که همه اطلاعات در یک خط قرار بگیرند).

وقتی که از table استفاده کنیم عرض صفحه خود به خود زیاد میشه و لازم نیست تا به صورت دستی عرض بهش بدیم. من با استفاده از این آموزش اومدم و با js یک جدول مجازی درست کردم که فقط مرورگر اون را می بینه ولی موتور های جستجو اون را نمی بینند به خاطر همین هم از tr , td داخل js استفاده کرده بودم.

0

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


لینک به پست

در div هم می تونه همینطور باشه ولی بهتره به div اصلی که بلوک را حفظ می کنه اندازه ای مشخص بدید که در همه نمایشگرها درست دیده بشه و بجای ساخت جدول js خاصیتش رو تعریف کنید مثل:


.block {
display:table-row;
width:3500px;
}
.post{
width:auto;
min-width:100px;
height:36px;
overflow:hidden;
display:table-cell
}

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

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

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

جاوا اسکریپت همون کار html را می کنه ولی بعد از لود صفحه و به همین خاطر در سورس کد تغییر ظاهری ایجاد نمی شه و الا وقتی اسکریپت شما می تونه tr را بخونه موتور جستجو هم می تونه

4

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط araska
      سلام
      روی وردپرس  ووکامرس و دکان نصب کردم نصب کردم حالا میخوام فقط در سطح شهر فعالیت کنم.
      یه افزونه میخوام که فروشنده های سایتم رو در یک شعاع مشخص ( که خودم اندازه اش رو تعیین میکنم ) برای مشتری نمایش بده ( مثلا لیست کنه ) و مشتری یکی رو انتخاب کنه و ازش خرید کنه .
      فکر کنم باید براساس مختصات باشه مثلا از gps استفاده بشه
      ممنون میشم کمکم کنید