PDA

View Full Version : Featured content slider



vigge_sWe
10-11-2008, 10:07 AM
1) Script Title: Featured Content Slider v2.4

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

3) Describe problem: I have a page where I want this slider. It works really great. The slider will get many pages, like 10+. The page is only 330 PX wide, so the pagination links gets to big when it shows all numbers. Is it possible to set it to show "[prev][4][5][6][7][8][next]" when you are on page 6, also it shows the page you are on in the middle, and the 2 previous and the 2 next?

Btw, DynamicDrive is a great site! I like what you do and have find the most thing useful in my projects. If it doesen't exsist elsewhere, it exsist on dynamicdrive :P

ddadmin
10-12-2008, 07:04 AM
In theory you should be able to use the "onChange" event handler of the script to determine which index the user is currently at, then dynamically enable only the neighboring pagination links to show as well. First, you'd get a reference to all the pagination links, using something like:


var paginationlinks=document.getElementById("paginationdiv").getElementsByTagName("a")

Then, inside the configuration code for Featured Content Slider, you may use the "onChange" event handler (see bottom of script page (http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm)) in a manner such as:


onChange: function(previndex, curindex){
for (var i=0; i<paginationlinks.length; i++){
//enable previous and next 3 pagination links from current)
paginationlinks[i].style.display=(i>=curindex-3 && i<=curindex+3)? "block" : "none"
}
}

That's the theory anyhow.

vigge_sWe
10-12-2008, 08:15 AM
In theory you should be able to use the "onChange" event handler of the script to determine which index the user is currently at, then dynamically enable only the neighboring pagination links to show as well. First, you'd get a reference to all the pagination links, using something like:


var paginationlinks=document.getElementById("paginationdiv").getElementsByTagName("a")

Then, inside the configuration code for Featured Content Slider, you may use the "onChange" event handler (see bottom of script page (http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm)) in a manner such as:


onChange: function(previndex, curindex){
for (var i=0; i<paginationlinks.length; i++){
//enable previous and next 3 pagination links from current)
paginationlinks[i].style.display=(i>=curindex-3 && i<=curindex+3)? "block" : "none"
}
}

That's the theory anyhow.

it still doesen't show it that way.

Should I edit
var paginationlinks=document.getElementById("paginationdiv").getElementsByTagName("a") and where should I place it?

Firebug says:
document.getElementById("paginationdiv") is null
file:///C:/Users/vigge_sWe/Desktop/tools/slider/contentslider.js
Line 235
paginationlinks is undefined
file:///C:/Users/vigge_sWe/Desktop/tools/search1.html#7
Line 88

ddadmin
10-12-2008, 11:48 PM
The code "var paginationlinks=document.getElementById("paginationdiv").getElementsByTagName("a")" was just a mockup. You would have to at least change "paginationdiv" to the ID of your pagination DIV. There may be additional changes required though based on how you've set up the script thus far. Please post a link to the page on your site that contains the problematic script so we can check it out.

vigge_sWe
10-13-2008, 06:25 AM
The code "var paginationlinks=document.getElementById("paginationdiv").getElementsByTagName("a")" was just a mockup. You would have to at least change "paginationdiv" to the ID of your pagination DIV. There may be additional changes required though based on how you've set up the script thus far. Please post a link to the page on your site that contains the problematic script so we can check it out.

I set the script up exactly as it was on the page, the first example. The div is called paginate-slider1 I belive, is that right? Because when I try that, it wont work either

ddadmin
10-14-2008, 05:39 PM
If your actual pagination DIV is called "paginate-slider1", then it would need to be:


var paginationlinks=document.getElementById("paginate-slider1").getElementsByTagName("a")

There are other details that need to be filled in as well, since as mentioned, what I posted was merely a blueprint. Please post a link to the page on your site that contains the problematic script so we can check it out.