hi i am a newbie so please be gentle.
have created ecommerce site in zen 1.3.9h using a template by bling themes called “digital shop”. sadly we cannot get any support. I have image handler 2 installed.
my slider is producing blurry images and i need to know how to set the variables in the js script to stop it stretching the images. please view my problem. www.thearmysurplusstore.co.uk
my pictures in other areas of the site are perfect and resolution is acceptable. i am sure that problems are due to slider
I found two JavaScript files that control the slider, they are in my - store\includes\ emplates\digitalshop\jscript
first code;
this.each(function() {
var obj = $(this);
var s = $(“li”, obj).length;
var w = $(“li”, obj).width();
var h = $(“li”, obj).height();
obj.width(w);
obj.height(h);
obj.css(“overflow”,“hidden”);
var ts = s-1;
var t = 0;
$(“ul”, obj).css(‘width’,s*w);
if(!options.vertical) $(“li”, obj).css(‘float’,‘left’);
I’m guessing the var w and var h have something to do with the size of the slider or images. I’m just not sure what to do here, I don’t know any JavaScript.
ALSO, in store/includes/templates/digitalshop/css there is a file stylesheet.css that has the following code:
/***********************************************/
/****************************
4. Featured slider1 Detail
******************************/
.clip{
width:590px;
height:275px;
}
#slider1 {
width: 590px; /* important to be same as image width /
height: 275px; / important to be same as image height /
position: relative; / important /
overflow: hidden; / important */
margin:3px 3px 3px 4px;
}
#slider1Content {
width: 590px; /* important to be same as image width or wider /
position: absolute; / DEFAULT absolute; /
top: 0;
margin-left: 0;
}
.slider1Image {
float: left; / DEFAULT left; */
position: relative;
display: none;
}
.slider1Image span {
position: absolute; /* DEFAULT absolute; */
font: 10px/15px Arial, Helvetica, sans-serif;
padding: 10px 13px;
width: 564px;
height:55px;
background-color: #000;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
display: none;
}
.slider1Image span strong {
font-size: 14px;
}
#slider1 .right {
right: 0;
bottom: 0;
width: 90px !important;
height: 275px;
}
#slider1 .bottom {
bottom: 0;
left: 0;
}
#slider1 ul {
list-style-type: none;
padding-left:0;
}
would really appreciate some tech help from anyone that is familiar with this.
thanking you all in advance for looking.
regards
laurie