2015-01-14 14 views
0

유성과 함께 scrollIt을 어떻게 사용합니까? jQuery가 Meteor에 포함되어 있지만 scrollIt에 대한 참조를 추가해야 할 필요가 있습니다. Meteor에서 할 수없는 권리입니까?scrollIt을 Meteor와 함께 사용하려면 어떻게해야합니까?

1)

<script src="jquery-1.10.2.min.js" type="text/javascript"></script> 
<script src="scrollIt.js" type="text/javascript"></script> 

2) 각 섹션

<div data-scroll-index="0">..content..</div> 
<div data-scroll-index="1">...</div> 
<div data-scroll-index="2">...</div> 

3 데이터 스크롤 굴절률 특성을 넣어) 데이터 - 대응 넣어 jQuery를하고 scrollIt.js 포함 각 nav 요소의 scroll-nav 속성

데이터 스크롤 - 고토 속성

<a data-scroll-goto="0">Back to top</a> 

5)에 넣어 섹션에 대한 링크

4),()에 유래에 오신 것을 환영의

$(function(){ 
    $.scrollIt(); 
}); 

답변

1

먼저 scrollIt를 호출합니다. 두 번째로 나는 유성에 대한 기본적인 이해를 여기에서 가정하고있다. 난 그냥 당신의 당신의 유스 케이스에 대한 단계는 다음 당신의 유성 프로젝트

내부 플러그인에 대한 HTML을 templatecode 및 JS 관련 코드를 제공합니다

단계-1 다음 client 디렉토리 안에 당신의 scroll.js lib에 파일을 넣어 아래 당신의 당신은 스크립트가 어디 태그를 포함 할 필요가없는

<your-project-lib>/client/scrollit.js 같은 프로젝트 루트 디렉토리

그래서, 그것은 것입니다. 유성이 그것을 처리합니다.

스텝 2 : follows-

scrollTemplate.html 같은 템플릿 내부의 HTML 코드를 넣어

<template name="scrollTemplate.html"> 

<div data-scroll-index="0">..content..</div> 
<div data-scroll-index="1">...</div> 
<div data-scroll-index="2">...</div> 

<~!-- Your whatever html code will go inside here --> 
<a data-scroll-nav="0">About</a> 
<a data-scroll-nav="1">Usage</a> 
<a data-scroll-nav="2">Options</a> 
</template> 

스텝 3 : 스크롤이 템플릿

rendered 경우에 초기화
Template.scrollTemplate.rendered= function(){ 
    $.scrollIt(); 
} 

템플릿의 렌더링 이벤트는 다음과 같습니다. ready 이벤트는 HTML 내부의 템플릿에만 적용됩니다.

테스트 해 보았지만 작동해야합니다.

관련 문제