سوال در مورد html

Acrobat · 27/12/12

سلام.

دوستان حتما دیدید که در بعضی صفحات html، لینک به داخل صفحه میدن.

مثل چند تا جدول توی صفحه هستش. بالای صفحه لیست عناوین رو میذارن. روی یکی از عنوان ها که کلیک میشه، اسکرول حرکت میکنه میره سر اون جدول!

میخاستم ببینم چطوری این کارو انجام میدن؟

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

میشه اینم یاد بدید؟

ممنون

Mohammad · 27/12/12

توی وب فارسی بهش میگن لنگر اگه اشتباه نکنم

ابتدا لینک میخوایم بدیم. به صورت زیر:

کد:

&lt;a href="#link"&gt;لینک&lt;/a&gt;

جایی که میخوای اسکرول بره:

کد:

&lt;a name="link"&gt;Salam ! chetori &lt;/a&gt;

اینکه اروم میره با جی کوئری شدنیه که باهاش کار نکردم. بگردی میتونی از خیلی از قالب ها در بیاری این حالتو

Acrobat · 27/12/12

ممنون محمد آقا. خیلی آقایی

Acrobat · 27/12/12

دوستان کسی نمیدونه چطوری باید اون جی کوئری که محمئد آقا گفتن رو پیدا کنیم؟

دوستان نیاز دارم. ممنون میشم کمکم کنید

-;{@

homayon574 · 27/12/12

و خداوند search engine ها را آفرید...!!!!

تو گوگل بزن

[h=1]Smooth Scrolling To Internal Links With jQuery[/h]یا

[h=2]JQuery Interal Link Animation Scrolling[/h]

Acrobat · 27/12/12

و خداوند search engine ها را آفرید...!!!! تو گوگل بزن

Smooth Scrolling To Internal Links With jQuery

یا

JQuery Interal Link Animation Scrolling

ممنونم آقا همایون.

سوئ تفاهم نشه. من نمیدونستم چی سرچ کنم. بخاطر همین مزاحم شدم!

بازم ممنون

-;{@

Acrobat · 27/12/12

ببخشید من این چیزی رو که گفتید سرچ کردم. به یه سری نتایج هم رسیدم. ولی توی کارم میذارم. کار نمیکنه.

میشه یه نمونه خوب رو بهم معرفی کنید. و کامل بگید چیکار باید بکنم؟

Acrobat · 27/12/12

ینی کسی نیست کمکم کنه؟!

kasraa · 27/12/12

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

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

Acrobat · 27/12/12

آقا کسرای عزیز. ممنون از لطفت.

ولی یه سری سایت ها هستن که حتی کد جی کوئریش هم میدن. میذارم توی قالب ولی عمل نمیکنه!

احتمال میدم که من اشتباه عمل کنم.

چون اموزش هاشم انگلیسی هستن که من سر در نمیارم خیلی.

میخوام یه نفر بهم بگه دقیقن چیکار کنم. یا کدش رو بذاره

EhsaanDev · 27/12/12

خب ما اول یه المنت درست میکنیم (مثلاً یه لینک یا دکمه) تا با اون به مقصد بریم.

سپس یه DIV مقصد هم درست میکنیم.

بعد هم توی قسمت جی کوئری پس از کدهای اولیه موقعیت المنت DIV مقصد را از نظر Scroll Top بدست میاریم و بعد هم با خصوصیت Animate کل داکیومنت رو به مقصد هدایت میکنیم.

خیلی راحت!

کد:

&lt;!DOCTYPE HTML&gt;
&lt;html&gt;
&lt;body&gt;
&lt;a href="#target" id="button"&gt;Go to target&lt;/a&gt;&lt;br&gt;
Lorm ipsum...&lt;br&gt;
&lt;div id="target"&gt;Target DIV&lt;/div&gt;
Lorm ipsum
&lt;script src="//code.jquery.com/jquery.min.js"&gt;&lt;/script&gt;
&lt;script&gt;
$(function() {
var $button= $('#button');
var $target = $('#target');
var pos = 0;
pos = $target.offset().top;
$button.click(function(e) {
    e.preventDefault();
    $('html, body').stop().animate({scrollTop: pos}, 500);
});
});
&lt;/script&gt;
&lt;/body&gt;&lt;/html&gt;

به جای عدد 500 سرعت رفتن به مقصد رو تعیین کنید.

Acrobat · 27/12/12

طرحی که دارم روی وب نمیاد.

اصلش اینه که آفلاین باشه.

یه کتابخونس.

فکر نکنم این آفلاین اجرا بشه.

بعد میشه یه کم ساده تر توضیح بدید؟! :s

EhsaanDev · 27/12/12

خب به جای //code.jquery.com/jquery.min.js

یه فایل jquery محلی بنویس.

این طوری آفلاین هم اجرا میشه.

والا ساده تر که بلد نیستم

اگه ممکنه دوستان یه تحلیلی بکنن.

Acrobat · 27/12/12

ممنونم/

دوستان اگر میتونن ساده بگن!

والا اینقدر سر و کله زدم گیراعیم زعیف شدح! :دی

kasraa · 27/12/12

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

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

HamedR · 28/12/12

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

کسری جان . معلوم وضع خیلی خرابه ها (اعتیاد داری از نوع شدیدش). کامپیوتر خاموش میکنی ، با موب میای . موب رو خاموش میکنی با کامپیوتر میای

-------------------------------------------

در ضمن کدی که احسان جان لطف کردن کامله و همچنین خیلی ساده . دیگه از این ساده تر نمیشه. فقط یه ذره فاصله ی بین شون کمه واسه همین قاطی میکنی.

این نوشته آقا احسان . فقط اضافاتش حذف شده.

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

کد:

&lt;a href="#target" id="button"&gt;Go to target&lt;/a&gt;
&lt;br&gt; Lorm ipsum...&lt;/br&gt;
&lt;div id="target"&gt;Target DIV&lt;/div&gt;

حالا میری جی کوئری رو دانلود میکنی. بعدش میاری تو پوشه ای که داری قالب میسازی میریزی (میتونی یه پوشه بسازی به اسم JS و بریزی توش. که اینطوری قشنگ تره)

حالا باید تو قسمت head این رو لود کنی (کتاب خانه جی کوئری)

کد:

&lt;script src="js/jquery.min.js"&gt;&lt;/script&gt;

دقت کن که jquery.min.js اسم همونی باشه که تو پوشه ی js قرار دادی.

اینم تو قسمت head کپی کن .

کد:

&lt;script&gt; $(function() { var $button= $('#button'); var $target = $('#target'); var pos = 0; pos = $target.offset().top; $button.click(function(e) {     e.preventDefault();     $('html, body').stop().animate({scrollTop: pos}, 500); });
}); &lt;/script&gt;

همون طوری که آقا احسان گفتن . 500 مقدار سرعتش هست که میتونی کم و زیاد کنی.

سوال در مورد html

Acrobat

کاربر عضو

Mohammad

مدیر انجمن

Acrobat

کاربر عضو

Acrobat

کاربر عضو

homayon574

کاربر عضو

Acrobat

کاربر عضو

Acrobat

کاربر عضو

Acrobat

کاربر عضو

kasraa

کاربر عضو

Acrobat

کاربر عضو

EhsaanDev

کاربر عضو

Acrobat

کاربر عضو

EhsaanDev

کاربر عضو

Acrobat

کاربر عضو

kasraa

کاربر عضو

HamedR

کاربر عضو