2011-07-17 6 views
0

JQuery JCarousel을 CAKEPHP보기에 설정했습니다. 이 특정 뷰에는 데이터베이스에서 일련의 축소판 및 제목을 수집하는 foreach 루프가 있습니다. 페이지를 클릭하면 클릭 한 부분의 확대 및 설명이있는 다른 페이지가 반환됩니다.사용자 정의 시작을 설정하면 JCarousel에 추가 공간이 추가됩니다. 위치

그래서 두 번째 페이지의 JCarousel을 이전 페이지에서 클릭 한 항목의 시작 위치로 다시로드합니다. 클릭 한 ID를 쿼리 문자열 "? n = id #"에 보내면 javascript를 사용하여 검색하고 변수에 할당 한 다음 내 JCarousel 함수에 할당합니다. 이것은 훌륭하게 작동하지만 문제는 내가 이것을 할 때 JCarousel이 캐 러셀의 첫 번째 항목 앞에 빈 공간을 추가한다는 것입니다. 또한 이전 페이지에서와 같이 클릭 한 회전식 항목을 정확한 위치에두고 싶습니다. 내 전체 컨베이어 블록은 페이지 당 8 개이며 크기가 다양합니다. 따라서 다음 버튼을 클릭하고 10 번 항목을 클릭하면 다음 버튼 클릭의 모양으로 시작하여 두 번째 자리에 항목 10을 표시하고 싶습니다. 나는 또한 오프셋과 수학으로 연주했지만 아무것도 작동하지 않습니다. 나는 그것이 나를 미치게하는 것에 따라 이것이 의미가 있기를 바란다.

<div id="wrap"> 
<ul id="mycarousel" class="jcarousel-skin-tango"> 
<?php $i=1; $cnt=1; ?> 
<?php foreach($all_works as $work): ?> 
<li class="clicked" id="<?php echo $cnt++; ?>">  
<a href="../../<?php echo $work['Work']['id'].DS.$work['Work']['category_id'].DS.$work['Work']['artist_id']; ?>?n=<?php echo $i++; ?>"> 
<?php echo $html->image('$image'.urlencode($work['Work']['picture']), array('border' => '0')); ?><span><?php echo $work['Work']['name']; ?></span></a> 
</li> 
<?php endforeach; ?> 
</ul><span><?php echo $cnt; ?> pieces shown</span></div> 

자바 스크립트가 URL과 JCarousel 검색

PHP 페이지 : : : 여기

내 코드의 형식에 대한

$.extend({ getUrlVars: function() 
{var vars = [], hash; 
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
for(var i = 0; i < hashes.length; i++) 
{hash = hashes[i].split('='); 
vars.push(hash[0]); 
vars[hash[0]] = hash[1];}  
return vars;}, 
getUrlVar: function(name) 
{  
return $.getUrlVars()[name]; }}); 

var byName = $.getUrlVar('n'); 

jQuery(document).ready(function() { 
jQuery('#mycarousel').jcarousel({ 
scroll: 8, 
start: byName 
}); 
}); 

미안, 처음에 게시 스택

답변

0

나는 이것을 알아 냈습니다.

그래서 한 번에 8 대의 항목을 내 컨베이어에 표시합니다. 이 숫자보다 많거나 적게 표시하면 필요에 맞게 조정해야합니다. 기본적으로 URL 문자열을 통과하는 인덱스의 수를 8.0001로 나눈 값입니다 (.0001 부분은 8의 배수가 아님). 그런 다음 반올림했습니다. 인덱스에서 첫 번째로 표시되는 항목이되도록 시작 인덱스가 필요하므로 꼭 클릭 한 항목이 아니기 때문에이 작업을 수행했습니다. 나는 8을 ​​곱한다. 이것은 8, 16, 24 등등의 솔리드 배수를 주었다. 나는 8을 ​​더했다. 이것은 else if 문에 대한 나의 범위를 주었다. 나는 8의 배수에 1을 더했다. 이것은 나에게 나의 시작 위치를 주었다.

$.extend(
     { getUrlVars: function() 
     { 

           var vars = [], hash;  
           var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');  
           for(var i = 0; i < hashes.length; i++)  
           {  
           hash = hashes[i].split('=');  
           vars.push(hash[0]);  
           vars[hash[0]] = hash[1];  
           }  
           return vars; 
           }, 
           getUrlVar: function(name) 
           {  
           return $.getUrlVars()[name]; }}); 

var byName = $.getUrlVar('n'); 
var totalItems = $.getUrlVar('c'); 
var wrapType = ""; 
var offsetNumber =""; 
var divisor = byName/8.0001; 
var mathRound = Math.floor(divisor); 
var eightA = mathRound * 8; 
var eightB = eightA + 8; 
var eightC = eightA + 1; 

if (byName == null || byName <= 8) 
{ 
byName = 1; 
wrapType = ""; 
offsetNumber = "0"; 
} 
else if (byName > eightA && byName <= eightB) 
{ 
byName = eightC; 
} 
else 
{ 
} 

jQuery(document).ready(function() { 
    jQuery('#mycarousel').jcarousel({ 
    scroll: 8, 
    visible: 8, 
    start: byName 
}); 
}); 
관련 문제