Having problem with magicpreview
Hi Guys,
I'm still pretty new to using Jquery and I'm trying to use Rik Lomas's Magic Preview plugin found here:
http://rikrikrik.com/jquery/magicpreview/ to help me create a form but for some reason I just can't seem to get it to work. I'm really only interested in changing a picture based on what is chosen in a <select> tab, but I just can't seem to get it right. If anyone could help me out I would really appreciate it. My current code is as follows:
- <script type="text/javascript" src="jquery.js"></script>
- <script type="text/javascript" src="global.js"></script>
- <script src="jquery.magicpreview.js" type="text/javascript"></script>
- <script type="text/javascript">
- $(function () {
- $('form.photopreview select').magicpreview('p_');
-
- $('form.photopreview :radio').magicpreview('p_', {
- 'formatValue': function (value) {
- return value + '/5';
- }
- });
- $('form.photopreview select').magicpreview('img_', {
- 'child': 'img',
- 'change': 'src',
- 'formatValue': function (value) {
- return '/magicpreview/images/' + value + '.jpg'
- }
- });
- });
- </script>
- </head>
- <body>
- <div id="container">
- <form action="requestquote.php" method="post">
- <div id="material">Material: </div><div id="p_materialform"><select name="materials" class="mp_form photopreview">
- <option value="#1">Absolute Black Jet</option>
- <option value="#2">Angola Black</option>
- <option value="#3">Bon Accord/Impala</option>
- <option value="4">Galaxy Star</option>
- <option value="5">Madura Gold</option>
- <option value="6">Tan Brown</option>
- </select>
- </div>
- <div id="img_materialimage">
- <img src="images/1.png" height="100" width="100"/>
- <p>Photo <span id="p_select">1</span> chosen</p>
- </div>
I would really love some help.
Thanks again!