Hello there
I'm writing a site in VB.NET
I'd like to add a product browser to my site like you guys use http://demos.telerik.com/aspnet-ajax/Controls/Examples/Default/DefaultVB.aspx. I'm talking about the "What's Included" Thumbnail Slider.
I have the code for your demo site on my machine. I'm having trouble understanding how the slider on the ASPX page links to the html listing of links
I found two settings of interest in the control
I beleive these are qsf.js scripts:
// demo thumbnails slider
function InitDemoSlider(sender, eventArgs)
{
var sliderId = sender.get_id();
eval("initialValue_" + sliderId + " = sender.get_minimumValue();");
HandleClientValueChange(sender, null);
}
function HandleClientValueChange(sender, eventArgs)
{
var sliderId = sender.get_id();
var wrapper = document.getElementById(sliderId + "_wrapper");
var content = document.getElementById(sliderId + "_content");
var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
var change = sender.get_value() - oldValue;
var contentWidth = content.scrollWidth - wrapper.offsetWidth;
var calculatedChangeStep = contentWidth / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
eval("initialValue_" + sliderId + " = initialValue_" + sliderId + " - change * calculatedChangeStep;");
eval("content.style.left = initialValue_" + sliderId + " + 'px';");
if (sender.get_value() == sender.get_minimumValue())
{
eval("content.style.left = 0;");
}
}
Is there somewhere that more thoughly explains how I can adapt this great usage of the slider control?
Cheers!
Tim
I'm writing a site in VB.NET
I'd like to add a product browser to my site like you guys use http://demos.telerik.com/aspnet-ajax/Controls/Examples/Default/DefaultVB.aspx. I'm talking about the "What's Included" Thumbnail Slider.
I have the code for your demo site on my machine. I'm having trouble understanding how the slider on the ASPX page links to the html listing of links
I found two settings of interest in the control
OnClientLoaded="InitDemoSlider" |
OnClientValueChanged="HandleClientValueChanged" |
I beleive these are qsf.js scripts:
// demo thumbnails slider
function InitDemoSlider(sender, eventArgs)
{
var sliderId = sender.get_id();
eval("initialValue_" + sliderId + " = sender.get_minimumValue();");
HandleClientValueChange(sender, null);
}
function HandleClientValueChange(sender, eventArgs)
{
var sliderId = sender.get_id();
var wrapper = document.getElementById(sliderId + "_wrapper");
var content = document.getElementById(sliderId + "_content");
var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
var change = sender.get_value() - oldValue;
var contentWidth = content.scrollWidth - wrapper.offsetWidth;
var calculatedChangeStep = contentWidth / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
eval("initialValue_" + sliderId + " = initialValue_" + sliderId + " - change * calculatedChangeStep;");
eval("content.style.left = initialValue_" + sliderId + " + 'px';");
if (sender.get_value() == sender.get_minimumValue())
{
eval("content.style.left = 0;");
}
}
Is there somewhere that more thoughly explains how I can adapt this great usage of the slider control?
Cheers!
Tim