Слайд контент со страницей вверх и вниз - PullRequest
0 голосов
/ 12 октября 2011

Несколько небольших вопросов на этой веб-странице, которые я собираю.

http://dansiop.com/guyc/our-team/

Я хочу получить контент, который появляется, когда вы нажимаете на изображение, чтобы скользить смышь при прокрутке вниз.Не уверен, если это возможно, если это так, может кто-нибудь помочь.

Я пытался искать, но, поскольку я такой n00b для jquery, я не уверен, что я ищу.Я нашел некоторый код, который использовал тег slide, и это было совсем не то, что я хотел, поэтому не уверен, какой будет команда.

1 Ответ

0 голосов
/ 12 октября 2011

Вам нужно обернуть prof_1, prof_2 и т. Д. В оболочку, которую я назову этой оболочкой prof_wrapper

<div id="prof_wrapper"></div>
jQuery(document).ready( function(){
   var orig_t = jQuery("#prof_wrapper").offset().top;
   var mt = jQuery("#main").offset().top;
   var mh = jQuery("#main").outerHeight();

   jQuery(document).bind("scroll", function(event){
      var ph = jQuery("#prof_wrapper").outerHeight();
      var mo = (mt+mh) - jQuery(document).scrollTop();
      var t = jQuery(document).scrollTop();
      if(mo <= ph){  //Find out if the #main element's offset top plus it's height minus the scroll position is less than the prof_wrapper's height; if it is, leave the prof_wrapper at the bottom of the #main element
          jQuery("#prof_wrapper").css({'position':'absolute', 'bottom':'0px', 'top':'auto'});
      }else if(t >= orig_t){ //Otherwise, if we have scrolled past the prof_wrapper, make the prof_wrapper follow us down
        jQuery("#prof_wrapper").css({'position':'fixed', 'top':'0px', 'bottom':'auto'});
      }else{ //We are probably at the top of the page, so reset the original positioning
        jQuery("#prof_wrapper").css({'position':'relative', 'top':'0px', 'bottom':'auto'});
      }
    });
});

Вам нужно добавить - position: относительно вашего элемента #main, тогда я думаю, что это должно быть довольно близко. Взгляните на мой комментарий по поводу отступов и полей на prof_wrapper.

Позиционирование абсолюта предполагает, что #main - первый родительский элемент, которому назначена позиция; если это так, то он будет использовать это как позиционирование для дна.

Что-то в этом роде?

...