JQuery вся страница / слайдер окна - PullRequest
Новая
       25

JQuery вся страница / слайдер окна

0 голосов
/ 16 января 2012

Я заинтересован в создании слайдера на всю страницу, например, http://littlemonsters.com/. Я посмотрел вокруг на их код и пытаюсь выяснить

- как они сделали весь этот слайд страницы (который, я думаю, просто очень большой слайдер), а также

- хотя отдельные «страницы» накладываются друг на друга (как обычные страницы), когда они скользят, они скользят влево и вправо (я думаю, это часть проблемы со слайдером)

Кажется, что для многих плагинов слайдеров они каким-то образом горизонтализируют элементы списка (тогда как, когда я делаю слайдеры вручную, я делаю действительно очень длинный широкий список с шириной примерно 9999 пикселей и имею скрытое окно просмотра переполнения - это, вероятно, не лучший способ). вот некоторые js, которые я нашел на вышеупомянутом сайте, которые, я думаю, содержат ключ, но я не могу понять слишком хорошо / неполно. 

step = (id) ->
  width = $(window).width()
  dir = 1
  dir = -1  if id < curId
  curId = id
  $(".boxDisplay").animate
    left: -1 * dir * width
  , 500, "swing", ->
    $(this).css "left", 0
    $(this).removeClass "boxDisplay"
    next = $(".box:eq(" + (id - 1) + ")")
    next.addClass "boxDisplay"
    boxPosition()
    next.css "left", dir * width
    next.animate
      left: 0
    , 500, "swing"
animate = ->
  i = 0
  $(".box").animate(
    left: -50
  , 10).animate(
    left: 0
  , 50).animate(
    left: 50
  , 10).animate(
    left: 0
  , 50).animate(
    left: -25
  , 10).animate(
    left: 0
  , 50).animate(
    left: 25
  , 10).animate(
    left: 0
  , 50).animate
    left: 0
  , 800
boxPosition = ->
  height = $(".boxDisplay").height()
  $(".box").css "margin-top", ($(window).height() / 2) - (height / 2)

$(document).ready ->
  boxPosition()

Спасибо!

...