bas
|
| Posted: 04/20/2011, 9:04 AM |
|
I need to use jQuery Zoom with CodeCharge
In CodeCharge page I have:
<img id="store_productsimage_url" alt="" src=""{image_url}">
in my Static jQuery demo page I have
<body>
<div id="content" style="margin-top:100px;margin-left:100px;">
<a href="kawasakigreen.jpg" class="jqzoom" style="" title="kawasaki">
<img src="kawasakigreen_small.jpg" title="kawasakigreen" style="border:
1px solid #666;">
</a><select
style="position:absolute;left:400px;top:10px;"><option>sdsdsds</option></select>
<br>
<div class="notes"> </div>
</div>
</body></html>
===== I tried this ======
<a href="{image_url}" class="jqzoom" style="" title="kawasaki">
<img id="store_productsimage_url" src="{image_url}" title="kawasakigreen"
style="border: 1px solid #666;">
</a>
didn't work... any ideas??
|
|
|
 |
Waspman
Posts: 948
|
| Posted: 04/20/2011, 12:02 PM |
|
try this...
http://www.mind-projects.it/projects/jqzoom/
or
http://dynamicdrive.com/dynamicindex4/imagepanner.htm
or
http://plugins.jquery.com/project/zooma
they seem straight forward. 
_________________
http://www.waspmedia.co.uk |
 |
|
bill
|
| Posted: 04/20/2011, 2:24 PM |
|
Thanks!!
Thats the one I'm using - older version 1.3 which works fine a sample
webpage
The older 1.3 version is simpler *** I don't need the options offered by
the newer version
Below is FULL code of the demo page - as you can see its much simpler to
use...
However, I've tried to adapted it to work with codecharge but not been
successful - hence the post!
<html>
<head>
<title>JQzoom Demo</title>
<script src="../js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="../js/jqzoom.pack.1.0.1.js" type="text/javascript"></script>
<link rel="stylesheet" href="../css/jqzoom.css" type="text/css">
<style type"text/css">
div.notes{
font-size:12px;
}
div.notes a{
color:#990000;
}
</style>
<script type="text/javascript">
$(function() {
$(".jqzoom").jqzoom();
});
</script>
</head>
<body>
<div id="content" style="margin-top:100px;margin-left:100px;">
<a href="kawasakigreen.jpg" class="jqzoom" style="" title="kawasaki">
<img src="kawasakigreen_small.jpg" title="kawasakigreen" style="border:
1px solid #666;">
</a><select
style="position:absolute;left:400px;top:10px;"><option>sdsdsds</option></select>
<br>
<div class="notes">
<small>created by Renzi Marco</small>
<a href="http://www.mind-projects.it/projects/jqzoom/contact.php">Hire
me</a><br>
<a href="http://www.mind-projects.it/projects/jqzoom">view all Demos</a>
</div>
</div>
</body>
</html>
"Waspman" <Waspman@forum.codecharge> wrote in message
news:54daf2db114eb1@news.codecharge.com...
> try this...
>
> http://www.mind-projects.it/projects/jqzoom/
> _________________
> http://www.waspmedia.co.uk
> ---------------------------------------
> Sent from YesSoftware forum
> http://forums.codecharge.com/
>
|
|
|
|
bas
|
| Posted: 04/21/2011, 1:34 AM |
|
oops - replied from coleagues notebook!
"bill" <bill@nospamplease.com> wrote in message
news:ionium$hsf$1@news.codecharge.com...
> Thanks!!
>
> Thats the one I'm using - older version 1.3 which works fine a sample
> webpage
>
> The older 1.3 version is simpler *** I don't need the options offered by
> the newer version
>
> Below is FULL code of the demo page - as you can see its much simpler to
> use...
> However, I've tried to adapted it to work with codecharge but not been
> successful - hence the post!
>
> <html>
> <head>
> <title>JQzoom Demo</title>
> <script src="../js/jquery-1.3.2.min.js" type="text/javascript"></script>
> <script src="../js/jqzoom.pack.1.0.1.js" type="text/javascript"></script>
>
> <link rel="stylesheet" href="../css/jqzoom.css" type="text/css">
> <style type"text/css">
> div.notes{
> font-size:12px;
> }
> div.notes a{
> color:#990000;
> }
>
> </style>
> <script type="text/javascript">
>
> $(function() {
> $(".jqzoom").jqzoom();
> });
> </script>
> </head>
>
> <body>
> <div id="content" style="margin-top:100px;margin-left:100px;">
> <a href="kawasakigreen.jpg" class="jqzoom" style="" title="kawasaki">
> <img src="kawasakigreen_small.jpg" title="kawasakigreen" style="border:
> 1px solid #666;">
> </a><select
> style="position:absolute;left:400px;top:10px;"><option>sdsdsds</option></select>
> <br>
>
> <div class="notes">
> <small>created by Renzi Marco</small>
> <a href="http://www.mind-projects.it/projects/jqzoom/contact.php">Hire
> me</a><br>
> <a href="http://www.mind-projects.it/projects/jqzoom">view all Demos</a>
> </div>
> </div>
> </body>
> </html>
>
>
>
> "Waspman" <Waspman@forum.codecharge> wrote in message
>news:54daf2db114eb1@news.codecharge.com...
>> try this...
>>
>> http://www.mind-projects.it/projects/jqzoom/
>> _________________
>> http://www.waspmedia.co.uk
>> ---------------------------------------
>> Sent from YesSoftware forum
>> http://forums.codecharge.com/
>>
>
>
|
|
|
|
CodeChargeMVP
Posts: 473
|
| Posted: 04/28/2011, 12:48 PM |
|
Hi,
¿Did you solved the issue?
_________________
Best Regards
Entrepeneur | NT Consultant
|
|
|
|
jjrjr2
Posts: 131
|
| Posted: 04/29/2011, 1:15 AM |
|
Try putting your Jquery stuff after the body tag or just before the ending head tag.
My experience has been that all jquery stuff needs to be after all CCS javascript has been loaded.
_________________
John Real - More CodeCharge Studio Support at - http://CCSElite.com
Real Web Development At: http://RealWebDevelopment.us |
|
|
|
Waspman
Posts: 948
|
| Posted: 04/29/2011, 1:26 AM |
|
John's right, before the last head tag always for me:)
_________________
http://www.waspmedia.co.uk |
|
|
|
bas
|
| Posted: 04/29/2011, 3:51 AM |
|
I modified it slightly and placed after Title
<script type="text/javascript" src="js/jqzoom.pack.1.0.1.js"></script>
<link rel="stylesheet" type="text/css" href="css/jqzoom.css">
<style type?css text?>
div.notes{
font-size:12px;
}
div.notes a{
color:#990000;
}
</style>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
$(".jqzoom").jqzoom();
});
</script>
This works but the Zoom is not loaded because href value is not set (kicks
off ...)
I can manually set href=www.mysite.com/images/imagelarge.jpg but
href="{image_url}" dosen't work!
"Waspman" <Waspman@forum.codecharge> wrote in message
news:54dba764bf3f78@news.codecharge.com...
> John's right, before the last head tag always for me:)
> _________________
> http://www.waspmedia.co.uk
> ---------------------------------------
> Sent from YesSoftware forum
> http://forums.yessoftware.com/
>
|
|
|
|
CodeChargeMVP
Posts: 473
|
| Posted: 04/29/2011, 4:13 AM |
|
I place all my functions just before this line:
window.onload = bind_events; //Assign bind_events @1-19F7B649
I think we mean the same 
_________________
Best Regards
Entrepeneur | NT Consultant
|
|
|
|
