Jump to content

Featured Replies

Перейдите в Панель администратора – Настройка – Темы и нажмите Включить дизайнер тем

затем в раскрывающемся меню темы выберите Дизайнер тем: ядра CSS и JS

В CSS поместите:

.stickyHeader{padding-top:70px;transition:transform .8s ease;animation:ani .8s forwards;}
.stickyHeader header.ipsHeader.ipsResponsive_header--desktop {position:fixed;z-index:2000;top:0;left:0;right:0;transition:transform .8s ease;animation:ani .8s forwards;}

.stickyHeader .ipsHeader__primary {
  -webkit-backdrop-filter:blur(20px);color: inherit;backdrop-filter:blur(20px);background:rgba(255, 255, 255, .18);box-shadow:0 15px 25px rgba(0, 0, 0, .6);
}

.stickyHeader .ipsHeader__secondary {
  -webkit-backdrop-filter:blur(20px);color: inherit;backdrop-filter:blur(20px);background:rgba(255, 255, 255, .18);box-shadow:0 15px 25px rgba(0, 0, 0, .6);
}

Сохранять

В Javascript поместите:

$(window).scroll(function() {
      //if( window.innerWidth >= 979 ){
        var height = $(window).scrollTop();
        if(height > 150){
        	$('.ipsApp').addClass('stickyHeader');
          	//$("[data-role='toTop']").removeClass('ipsHide');
        } else{
        	$('.ipsApp').removeClass('stickyHeader');
          	//$("[data-role='toTop']").addClass('ipsHide');
        }
      //}
  	});

Сохранять

blur1.png

blur2.png

Link to comment
https://ipbmafia.ru/topic/28175-stickyheader/
Share on other sites
  • 3 недели спустя...
On 28.10.2024 at 00:24, Silence said:

Перейдите в Панель администратора – Настройка – Темы и нажмите Включить дизайнер тем

затем в раскрывающемся меню темы выберите Дизайнер тем: ядра CSS и JS

В CSS поместите:

.stickyHeader{padding-top:70px;transition:transform .8s ease;animation:ani .8s forwards;}
.stickyHeader header.ipsHeader.ipsResponsive_header--desktop {position:fixed;z-index:2000;top:0;left:0;right:0;transition:transform .8s ease;animation:ani .8s forwards;}

.stickyHeader .ipsHeader__primary {
  -webkit-backdrop-filter:blur(20px);color: inherit;backdrop-filter:blur(20px);background:rgba(255, 255, 255, .18);box-shadow:0 15px 25px rgba(0, 0, 0, .6);
}

.stickyHeader .ipsHeader__secondary {
  -webkit-backdrop-filter:blur(20px);color: inherit;backdrop-filter:blur(20px);background:rgba(255, 255, 255, .18);box-shadow:0 15px 25px rgba(0, 0, 0, .6);
}

Сохранять

В Javascript поместите:

$(window).scroll(function() {
      //if( window.innerWidth >= 979 ){
        var height = $(window).scrollTop();
        if(height > 150){
        	$('.ipsApp').addClass('stickyHeader');
          	//$("[data-role='toTop']").removeClass('ipsHide');
        } else{
        	$('.ipsApp').removeClass('stickyHeader');
          	//$("[data-role='toTop']").addClass('ipsHide');
        }
      //}
  	});

Сохранять

blur1.png

blur2.png

А родной вариант не канает уже?

https://invisionbyte.ru/docs/custom/javascript/ipsuisticky-r211/

Link to comment
https://ipbmafia.ru/topic/28175-stickyheader/?&do=findComment&comment=213338
Share on other sites
1 hour ago, avangcom said:

??

Link to comment
https://ipbmafia.ru/topic/28175-stickyheader/?&do=findComment&comment=213385
Share on other sites
1 hour ago, Silence said:

??

help for stickyPostbit

Link to comment
https://ipbmafia.ru/topic/28175-stickyheader/?&do=findComment&comment=213388
Share on other sites
57 минут назад, avangcom said:

help for stickyPostbit

CSS

.ipsEntry__author-column {

position: sticky;

top: 0;

right: 0;

overflow: hidden;

height: 500px;

}

Link to comment
https://ipbmafia.ru/topic/28175-stickyheader/?&do=findComment&comment=213391
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.


Guest
Ответить в этой теме...

Последние посетители 0

  • No registered users viewing this page.