Check out my site here:
I've been experimenting with images on my product pages and even created a test page.
I have a few questions that I can't seem to figure out:
- Where should I host a jquery file?
- Do I need to include the jquery src for both jquery.min.js (many use the one hosted by google) and jquery.elevatezoom.js?
- If I decide not to use the zoom feature, is there still a way to have a large image with small thumbnails below it? Maybe clicking on the big image could open a full-screen version.
- Should all my pictures be the same size? Currently, I have square and rectangle format photos which might not look great together.
- Do I insert code into CSS or just on the specific page where I want the images displayed?
- Will the images I add using jquery replace the ones uploaded through Big Cartel's system?
- There is already a jquery entry in the layout...do I simply add additional src at the end of this section?
In the layout, I added this:
<script src="http://s000.tinyupload.com/index.php?file_id=24823496361920795072" type="text/javascript"></script>On my test page, I have:
<img id="zoom_01" src="http://i.imgur.com/1L86Fcms.jpg" data-zoom-image="http://i.imgur.com/1L86Fcm.jpg"/>
$("#img_01").elevateZoom();
<head><script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript"></script></head>
<img id="product_zoom" src="http://i.imgur.com/1L86Fcms.jpg" data-zoom-image="http://i.imgur.com/1L86Fcm.jpg" class="fade_in">Thank you for all your help! I may have bitten off more than I can chew as I delve into this world beyond my basic HTML skills. I was just trying to experiment and see if I liked it, but it turned into a whole new challenge.
If you're interested, here's where I found some information on jquery: Can I integrate an Internal zoom on my products in my big cartel store?