Вопросы Теги

Как я могу заставить отделение придерживаться вершины экрана, после того как это было прокручено до?

Установите имя файла в ContentType также. Это должно решить проблему. 

context.Response.ContentType = "application/pdf; name=" + fileName;
// the usual stuff
context.Response.AddHeader("content-disposition", "inline; filename=" + fileName);

после установки заголовка довольного расположения, также добавьте заголовок довольной длины, затем используйте binarywrite для потоковой передачи PDF. 

context.Response.AddHeader("Content-Length", fileBytes.Length.ToString());
context.Response.BinaryWrite(fileBytes);
293
задан Aurélien Ooms 14 May 2019 в 11:56
поделиться

4 ответа

Вы можете использовать просто css, позиционируя свой элемент как fixed : 

.fixedElement {
    background-color: #c0c0c0;
    position:fixed;
    top:0;
    width:100%;
    z-index:100;
}

Изменить: У вас должен быть элемент с абсолютной позицией, как только смещение прокрутки будет достигнув элемента, его следует изменить на фиксированное, а верхнее положение должно быть установлено на ноль.

Вы можете определить смещение верхней прокрутки документа с помощью функции scrollTop : 

$(window).scroll(function(e){ 
  var $el = $('.fixedElement'); 
  var isPositionFixed = ($el.css('position') == 'fixed');
  if ($(this).scrollTop() > 200 && !isPositionFixed){ 
    $el.css({'position': 'fixed', 'top': '0px'}); 
  }
  if ($(this).scrollTop() < 200 && isPositionFixed){
    $el.css({'position': 'static', 'top': '0px'}); 
  } 
});

Когда смещение прокрутки достигло 200, элемент прикрепит к верхней части окна браузера, потому что он размещен как фиксированный.

243
ответ дан 23 November 2019 в 01:38
поделиться

Информация, предоставленная для ответа на этот другой вопрос, может быть вам полезна, Эван:

Проверьте, отображается ли элемент после прокрутки

Вы в основном хотите изменить стиль элемента установить фиксированное значение только после проверки того, что значение document.body.scrollTop больше или равно верхнему краю вашего элемента.

0
ответ дан 23 November 2019 в 01:38
поделиться

Вы видели этот пример на странице выпуска номера Google Code и (только недавно) на странице редактирования переполнения стека.

Ответ CMS не возвращает позиционирование при прокрутке резервного копирования. Вот бессмысленно украденный код из переполнения стека: 

function moveScroller() {
    var $anchor = $("#scroller-anchor");
    var $scroller = $('#scroller');

    var move = function() {
        var st = $(window).scrollTop();
        var ot = $anchor.offset().top;
        if(st > ot) {
            $scroller.css({
                position: "fixed",
                top: "0px"
            });
        } else {
            $scroller.css({
                position: "relative",
                top: ""
            });
        }
    };
    $(window).scroll(move);
    move();
}

<div id="sidebar" style="width:270px;"> 
  <div id="scroller-anchor"></div> 
  <div id="scroller" style="margin-top:10px; width:270px"> 
    Scroller Scroller Scroller
  </div>
</div>

<script type="text/javascript"> 
  $(function() {
    moveScroller();
  });
</script>

и простой живой демонстрационной демонстрации .

Зарождающаяся альтернативная альтернативная скрипта : Sticky , который поддерживается в Chrome, Firefox и Safari. См. Статью на HTML5rocks и демонстрация и Mozilla Docs .

242
ответ дан 23 November 2019 в 01:38
поделиться

Принятый ответ работает, но не перемещается на предыдущую позицию при прокрутке над ним. Он всегда остается на самом верху после того, как был помещен туда. 

  $(window).scroll(function(e) {
    $el = $('.fixedElement');
    if ($(this).scrollTop() > 42 && $el.css('position') != 'fixed') {
      $('.fixedElement').css( 'position': 'fixed', 'top': '0px');

    } else if ($(this).scrollTop() < 42 && $el.css('position') != 'relative') {
      $('.fixedElement').css( 'relative': 'fixed', 'top': '42px');
//this was just my previous position/formating
    }
  });

Ответ jleedev должен работать, но я не смог заставить его работать. Его страница примера также не работает (у меня).

0
ответ дан 23 November 2019 в 01:38
поделиться
Другие вопросы по тегам:

Похожие вопросы: