رفتن به مطلب

لینک دهی در یک صفحه


پست های پیشنهاد شده

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

لینک به ارسال
در در ۱۳۹۹/۱۲/۴ در 16:39، baharsh گفته است :

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

این آموزش رو ببینید.

لینک به ارسال
در 19 ساعت قبل، yazdaniwp گفته است :

این آموزش رو ببینید.

من لینک گزاری رو بلدم 
چطور افکت بدم به پایین اومدن و اسکرول شدن رونمیدونم چطور انجام میدن
مثل این سایت  https://www.creadea.com/

لینک به ارسال
در 11 ساعت قبل، baharsh گفته است :

من لینک گزاری رو بلدم 
چطور افکت بدم به پایین اومدن و اسکرول شدن رونمیدونم چطور انجام میدن
مثل این سایت  https://www.creadea.com/

مشخصه که اصلا لینک رو باز نکردید :)

بزرگوار، این مبحث مربوط به html هست، نحوه پیاده سازیش طولانی هست برای همین لینک آموزشش رو فرستادم. اگه با یکی دو خط میشد توضیح داد قطعا این کار رو انجام میدادم.

لینک به ارسال
در در ۱۳۹۹/۱۲/۹ در 23:51، yazdaniwp گفته است :

مشخصه که اصلا لینک رو باز نکردید :)

بزرگوار، این مبحث مربوط به html هست، نحوه پیاده سازیش طولانی هست برای همین لینک آموزشش رو فرستادم. اگه با یکی دو خط میشد توضیح داد قطعا این کار رو انجام میدادم.

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

لینک به ارسال
در در ۱۳۹۹/۱۲/۱۱ در 11:00، baharsh گفته است :

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

سلام

باید بصورت #id به المان مورد نظر خودتون لینک بدید

مثلا در انتهای همین صفحه المانی با آِی دی elFooterLinks وجود داره

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

البته نباید لینک رو target="_blank" کنید

مثال لینک به یک المان در همین صفحه:

<a href="#elFooterLinks">لینک</a>

نتیجه: 

لینک

ویرایش شده توسط saeeedhassani
لینک به ارسال
در 7 ساعت قبل، saeeedhassani گفته است :

سلام

باید بصورت #id به المان مورد نظر خودتون لینک بدید

مثلا در انتهای همین صفحه المانی با آِی دی elFooterLinks وجود داره

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

البته نباید لینک رو target="_blank" کنید

مثال لینک به یک المان در همین صفحه:


<a href="#elFooterLinks">لینک</a>

نتیجه: 

لینک

سلام دوست عزیز

در ابتداممنونم برای توضیحاتتون 

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

لینک به ارسال

سلام. سوال شما باعث شد من بگردم و راه حل این مساله رو پیدا کنم

برای این منظور کد

html {
	scroll-behavior: smooth;}

رو به css سایت اضافه کنید.

من خودم برای تست درستی این کد اون رو توی این صفحه: لینک (کلمه مخزن بتنی رو لینک کردم) قرار دادم. میتونی ببینی همونیه که میخواستی یا نه

اما با توجه به سایتی که فرستاده بودین فکر میکنم اوکی باشه و بعد میری توی کد همون صفحه و برای سکشن ها #id میذاری و بعد لینکی که میخوای بدی رو میری لینک میکنی به این آیدی

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

لینک به ارسال
در 1 ساعت قبل، niktalab گفته است :

سلام. سوال شما باعث شد من بگردم و راه حل این مساله رو پیدا کنم

برای این منظور کد


html {
	scroll-behavior: smooth;}

رو به css سایت اضافه کنید.

من خودم برای تست درستی این کد اون رو توی این صفحه: لینک (کلمه مخزن بتنی رو لینک کردم) قرار دادم. میتونی ببینی همونیه که میخواستی یا نه

اما با توجه به سایتی که فرستاده بودین فکر میکنم اوکی باشه و بعد میری توی کد همون صفحه و برای سکشن ها #id میذاری و بعد لینکی که میخوای بدی رو میری لینک میکنی به این آیدی

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

سپاسگزارم دوست عزیز
همونی بود که می خواستم 
عاااااااالی شد ممنون:)

لینک به ارسال
در 3 ساعت قبل، baharsh گفته است :

سپاسگزارم دوست عزیز
همونی بود که می خواستم 
عاااااااالی شد ممنون:)

یه راه دیگه هم هست

افزونه Page scroll to id رو نصب کن و در تنظیمات افکت اسکرول لینک رو انتخاب کن

کلی افکت اسکرول باحال داره :‌)

لینک به ارسال
در در ۱۳۹۹/۱۲/۱۳ در 10:44، baharsh گفته است :

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

سلام کد جاوا اسکریپت

$(document).on('click', 'a[href^="#"]', function(e) {
		// target element id
		var id = $(this).attr('href');
		// target element
		var $id = $(id);
		if ($id.length === 0) { return; }
		// prevent standard hash navigation (avoid blinking in IE)
		e.preventDefault();
		// top position relative to the document
		var pos = $id.offset().top - 50 ;
		// animated top scrolling
		$('body, html').animate({scrollTop: pos});
	});

 

لینک به ارسال
در در ۱۳۹۹/۱۲/۲۱ در 01:17، asadiy4n گفته است :

سلام کد جاوا اسکریپت


$(document).on('click', 'a[href^="#"]', function(e) {
		// target element id
		var id = $(this).attr('href');
		// target element
		var $id = $(id);
		if ($id.length === 0) { return; }
		// prevent standard hash navigation (avoid blinking in IE)
		e.preventDefault();
		// top position relative to the document
		var pos = $id.offset().top - 50 ;
		// animated top scrolling
		$('body, html').animate({scrollTop: pos});
	});

 

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

لینک به ارسال
در 4 ساعت قبل، baharsh گفته است :

ممنون میشم توضیح بدید

خواهش می کنم

کدهای جاوا اسکریپ رو می تونید داخل تگ head در header.php بذارید یا قبل از بسته شدن تگ body

کدهای jQuery مثل همین کد هم به همین شکل هست فقط باید حتما کد مربوطه بعد از فراخوانی اسکریپت jQuery قرار داده بشه

لینک به ارسال
در 9 دقیقه قبل، asadiy4n گفته است :

خواهش می کنم

کدهای جاوا اسکریپ رو می تونید داخل تگ head در header.php بذارید یا قبل از بسته شدن تگ body

کدهای jQuery مثل همین کد هم به همین شکل هست فقط باید حتما کد مربوطه بعد از فراخوانی اسکریپت jQuery قرار داده بشه

سپاسگزارم

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...