For clarity:
<script type="text/javascript" src="/includes/jquery.js"></script>
<script type="text/javascript">
//*** for scrolling cart upsells
$(document).ready(function(){
$("#scrollLeft").addClass("none");
});
</script>
<style media="all" type="text/css">
.none {
display: none;
}
</style>
<div id="upsell">
<%
Dim
strACCItem,strACCItemNo,strACCItemDescription,strACCItemPrice,strACCItemEDP
For intA = 1 to RELATEDNUM
If intA <= intACCItemCount Then
strACCItem = Trim(objRelateds.GetValue
("ItemNo", intA))
strACCItemNo = server.urlencode(Trim
(objRelateds.GetValue("ItemNo", intA)))
strACCItemDescription = trim
(objRelateds.GetValue("ItemDescription", intA))
strACCItemPrice = FormatCurrency(Trim
(objrELATEDS.GetValue("ItemPrice", intA)))
strACCItemEDP = trim
(objRelateds.GetValue("ItemEDP", intA))
%>
<div class="upsell_feature_module" <%
if intA = 2 then %> style="margin-left:32px;" <%end if%>>
<a class="upsell_img" href="/
detail/<%=strACCItemNo%>">
<img src="<%=getEDPImage
(strACCItemEDP,"")%>" alt="" border="0" width="84" height="84" /></a>
<div class="upsell_text">
<a href="/detail/<%=strACCItemNo
%>"><%=Replace(strAccItem, MACS_PREFIX & " ", "")%></a>
</div><!-- /upsell_text -->
</div><!-- /upsell_feature -->
<%
End If
Next
' Remaining products to cycle/scroll through
BUT THESE ARE HIDDEN
For intA = intA to intACCItemCount
strACCItem = Trim(objRelateds.GetValue
("ItemNo", intA))
strACCItemNo = server.urlencode(Trim
(objRelateds.GetValue("ItemNo", intA)))
strACCItemDescription = trim
(objRelateds.GetValue("ItemDescription", intA))
strACCItemPrice = FormatCurrency(Trim
(objrELATEDS.GetValue("ItemPrice", intA)))
strACCItemEDP = trim(objRelateds.GetValue
("ItemEDP", intA))
%>
<div class="upsell_feature_module none"
style="margin-left: 5px;">
<a class="upsell_img" href="/detail/<
%=strACCItemNo%>">
<img src="<%=getEDPImage
(strACCItemEDP,"")%>" alt="" border="0" width="84" height="84" /></a>
<div class="upsell_text">
<a href="/detail/<%=strACCItemNo%>"><
%=Replace(strAccItem, MACS_PREFIX & " ", "")%></a>
</div><!-- /upsell_text -->
</div><!-- /upsell_feature -->
<%
Next
%>
<div style="position: absolute; width: 24px;
left:
6px; top: 52px;">
<img class="hmm" onclick="scrollCartUpsells
(-1);" id="scrollLeft" src="/images/arrow_left.gif" alt="scroll left"
width="24" height="77"/>
</div>
<div style="position: absolute; width: 24px;
left: 259px; top: 52px;">
<img class="hmm" onclick="scrollCartUpsells
(1);" id="scrollRight" src="/images/arrow_right.gif" alt="scroll
right" width="24" height="77"/>
</div>
<script type="text/javascript">
// BEGIN JSCRIPT FOR SCROLLING CART UPSELLS //
var firstInt;
var nextInt;
var prevInt;
var lastInt;
var endInt = <%=intACCItemCount%>;
var spanInt = <%=RELATEDNUM%>;
//alert('spanInt = ' + spanInt);
var endScroll = Number(endInt) - Number(spanInt);
//alert('endScroll = ' + endScroll);
var totalDiv = Number($
("div#upsell .upsell_feature_module:visible").siblings("div").size())
- 2
if(Number(totalDiv) <= Number(spanInt)){
$("#scrollRight").addClass("none");
}
function scrollCartUpsells(num){
if (Number(num) == 1){
firstInt = Number($
("div#upsell .upsell_feature_module:visible").attr("id"));
//Gets you the first visible .upsell_feature_module's ID
(in id="upcell" container)...
alert(firstInt);
nextInt = Number(firstInt) + 1;
prevInt = Number(firstInt) - 1;
lastInt = Number(firstInt) + Number(spanInt); // lastInt
gets display: none;
}
if (Number(num) == -1){
firstInt = Number($
("div#upsell .upsell_feature_module:visible").attr("id")) -1;
nextInt = Number(firstInt) + 1;
prevInt = Number(firstInt) - 1;
lastInt = Number(firstInt) + Number(spanInt); // lastInt
gets display: none;
}
// ******** ******** BUTTON VISIBILITY CONTROLS ********
********
if(Number(firstInt) > 0) {
$("#scrollLeft").removeClass("none");
}
if(Number(firstInt) <= 1) {
$("#scrollLeft").addClass("none");
if(Number($("div#upsell .upsell_feature_module:visible").attr
("id")) == 1){
$("#scrollLeft").removeClass("none");
}
}
if(Number(lastInt) >= Number(endInt)) {
$("#scrollRight").addClass("none");
}
if(Number(lastInt) < Number(endInt)) {
$("#scrollRight").removeClass("none");
}
// ******** ******** BUTTON VISIBILITY CONTROLS ********
********
if (Number(num) == 1){
$("#"+firstInt).addClass("none");
$("#"+firstInt).css('margin-left', '5px');
$("#"+nextInt).css('margin-left', '40px');
$("#"+lastInt).removeClass("none");
}
if (Number(num) == -1){
lastInt = Number(firstInt) + Number(spanInt);
$("#"+firstInt).removeClass("none");
$("#"+firstInt).css('margin-left', '40px');
$("#"+nextInt).css('margin-left', '5px');
$("#"+lastInt).addClass("none");
$("#scrollRight").removeClass("none");
}
}
// END JSCRIPT FOR SCROLLING CART UPSELLS //
</script>
</div><!-- /upsell -->
When my code runs I do get 2 visable products and 17 more div's with a
class of None (hidden)....
Not sure why the code was not reusable... any help writing it better
appreciated. ;)
On Mar 20, 9:01 am, Danjojo <dlcac...@gmail.com> wrote:
> Ok cool, I was wondering, isn't it supposed to return a number?
> because I am alerting NaN
>
> On Mar 20, 8:19 am, jQuery Lover <ilovejqu...@gmail.com> wrote:
>
> > Gets you the first visible .upsell_feature_module's ID (in id="upcell"
> > container).
>
> > ----
> > Read jQuery HowTo Resource - http://jquery-howto.blogspot.com
>
> > On Fri, Mar 20, 2009 at 5:01 PM, Danjojo <dlcac...@gmail.com> wrote:
>
> > > Sorry not a quiz... I just am having trouble remembering how I built
> > > this.
>
> > > What does this do?
>
> > > firstInt = Number($("div#upsell .upsell_feature_module:visible").attr
> > > ("id"));
>
> > > Is it counting where in the chain of Div's the current position is?
>
> > > My code is:
>
> > > function scrollCartUpsells(num){
> > > if (Number(num) == 1){
> > > firstInt = Number($
> > > ("div#upsell .upsell_feature_module:visible").attr("id"));
> > > alert(firstInt);
> > > nextInt = Number(firstInt) + 1;
> > > prevInt = Number(firstInt) - 1;
> > > lastInt = Number(firstInt) + Number(spanInt); // lastInt
> > > gets display: none;
> > > }
> > > if (Number(num) == -1){
> > > firstInt = Number($
> > > ("div#upsell .upsell_feature_module:visible").attr("id")) -1;
> > > nextInt = Number(firstInt) + 1;
> > > prevInt = Number(firstInt) - 1;
> > > lastInt = Number(firstInt) + Number(spanInt); // lastInt
> > > gets display: none;
> > > }
>
> > > // ******** ******** BUTTON VISIBILITY CONTROLS ********
> > > ********
> > > if(Number(firstInt) > 0) {
> > > $("#scrollLeft").removeClass("none");
> > > }
> > > if(Number(firstInt) <= 1) {
> > > $("#scrollLeft").addClass("none");
> > > if(Number($("div#upsell
> > > .upsell_feature_module:visible").attr
> > > ("id")) == 1){
> > > $("#scrollLeft").removeClass("none");
> > > }
> > > }
> > > if(Number(lastInt) >= Number(endInt)) {
> > > $("#scrollRight").addClass("none");
> > > }
> > > if(Number(lastInt) < Number(endInt)) {
> > > $("#scrollRight").removeClass("none");
> > > }
> > > // ******** ******** BUTTON VISIBILITY CONTROLS ********
> > > ********
>
> > > if (Number(num) == 1){
> > > $("#"+firstInt).addClass("none");
> > > $("#"+firstInt).css('margin-left', '5px');
> > > $("#"+nextInt).css('margin-left', '40px');
> > > $("#"+lastInt).removeClass("none");
> > > }
> > > if (Number(num) == -1){
> > > lastInt = Number(firstInt) + Number(spanInt);
> > > $("#"+firstInt).removeClass("none");
> > > $("#"+firstInt).css('margin-left', '40px');
> > > $("#"+nextInt).css('margin-left', '5px');
> > > $("#"+lastInt).addClass("none");
> > > $("#scrollRight").removeClass("none");
> > > }
> > > }
