داخل سایت های مختلف دیدیم که وقتی اندکی صفحه سایت را اسکرول میزنیم ، دکمه نمایان میشود و معمولا فلش به سمت بالاست. کد html رفتن به بالای صفحه در خصوص این موارد حاکم فرماست و اجرای آن آسان می باشد. نیازی به افزونه یا کدهای جاوا اسکریپت و پیچیده نیست.
کد html رفتن به بالای صفحه
برای اینکار کافیست به ابتدای صفحه خود یک تگ اضافه کنید و به اون تگ یک آیدی بدهید. البته تگ های زیادی وجود دارد که می توانید به آنان لینک دهید.
تمایل دارید ببینید : کد html رفتن به خط بعد
مثلا بالاترین تگ ما به این صورت می توان باشد :
<body id="top">این بالاترین تگ پیچ شماست که به آن id اختصاص داده اید.
حالا کافیست یک دکمه ایجاد کنید و به آن لینک دهید. اینگونه.
<a class="top arrow" href="#top"><i class="fa fa-chevron-up"></i></a>برای قرار گرفتن موقعیت و زیبا سازی دکمه می توانید از استایل های متفاوتی استفاده کنید.
#back-to-top .top {
z-index: 999;
position: fixed;
margin: 0px;
color: #DE3930;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
position: fixed;
bottom: 115px;
right: 25px;
z-index: 999;
font-size: 14px;
background: none;
border: 2px solid #DE3930;
width: 40px;
height: 40px;
text-align: center;
line-height: 34px;
}
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}شما یک دکمه در گوشه سمت راست و پایین صفحه دارید که با کلیک بروی آن می توانید به بالای صفحه بروید.
این کد بسیار ساده است ولی در همه سایت ها کاربرد دارد و خود بنده از آن در تماس سایت ها برای رفتن به بالای صفحه استفاده می کنم.
البته در صورتی که سایت شما از برنامه های پشتیبانی استفاده می کند و گوشه های صفحه را پوشانیده اید، استفاده از این مورد باعث شلوغی میشود.
در سایت ما از سیستم پشتیبانی در گوشه ها استفاده کرده ایم و کد فوق را غیر فعال نموده ایم.
خیلی خوب بود ولی چطوری باید بره گوشه صفحه؟
با سلام،
با css به دکمتون تنظیمات بدید تا بیاد گوشه. مثلام
پوزیشن را آبسولیت
راست و پایین صفر بدید.
با احترام فراوان.