Jump to content

Complete (Girly) Newbie needing Attribute help!


Recommended Posts

Hi All,


So i am setting up an on line shop selling wigs!! I am really struggling on the attribute image display as its very basic and the images are very small ( I have tried to change image size but I cant seem to edit any css files.)


Does anyone know a module or a free/cheap way of setting up some sort of pop up display for attributes?


I want the customer to be able to see a clear sample of the hair colours available. Here is a link to a web site which will give an example - just look at the colour chart.




I am a complete newbie so treat me gentle :P


Any help and advice welcome

Link to comment
Share on other sites

Do you want to enlarge the dialog box when you press the magnifying glass on your wig colour?


Then a good start may be to locate the <div class ="dialog" id="dialog-1"...> (the one that pops up when pressing the magn. glass)

and add:


width:YYYpx; (e.g. width:650px;)


height:ZZZpx; (eg height:600px) YYY/ZZZ are the required width height of the dialog box)



then locate

<div id="content-big-image">

and add a

height:YYYpx; (eg. height:500px;)




from there move the navigation part down (div class"content-small-list"...> by adding

position: absolute; (make the position fixed, instead of floating)

and add a fixed top and left position:

top: YYYpx; (YYY=required top position, eg 550)

left: ZZZ:px; (ZZZ = required left position, eg 100)


finally, locate

<div class="contents-big-image-info" >

and inside here you will find a <img src="..."> (the enlarged picture itself)

Here, add required height and width of picture, like

<img src="..." width:400px; height400px;> or so


Hope this may give an idea. (n.b. I found and played with the numbers using chrome, right click in the enlarged item and select "inspect item". This gives you the chance to play with the numbers so you can see 'real time' how it will look like. You can add properties like height and width to the element.style here.)


Hope this helps,


Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Create New...