CODEWITHSUNDEEP
javascriptjquerymagento
Jasmine
Jasmine

Reputation: 3

How to insert Javascript into Magento?

as you can see from the attachment aall.html, if I run from this file local, the output would be as attachment 334.png(the galaxy picture) So my question is how can I Insert this "galaxy picture" and functions into my Magento 1.9.2.3 (for example: 415.png)?

or

how do i add <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"></script>into Magento?

how do i add <script type="text/javascript" src="http://davidlynch.org/projects/maphilight/jquery.maphilight.js"></script> into Magento?

how do I add <script> var $j = jQuery.noConflict(); $j(document).ready(function(){$j('#ImageMap1').maphilight();}); </script> into Magento?

p.s. all this coding is in aall.html

I hope that you understand my question, thank you very much for your help



334.png

415.png



aall.html are the codes as shown as below: 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"></script>
 <script type="text/javascript" src="http://davidlynch.org/projects/maphilight/jquery.maphilight.js"></script>
<div style="float: left">
    <img id="ImageMap1" src="http://geographyandhistory.wikispaces.com/file/view/solar_system.jpg/43347125/283x202/solar_system.jpg" usemap="#ImageMapmapAreas" />
    <map id="ImageMapmapAreas" name="ImageMapmapAreas">
        <area alt="" title="" href="#Earth" coords="228,151,53" shape="circle" data-maphilight='{"strokeColor":"0000ff","strokeWidth":5,"fillColor":"00ff00","fillOpacity":0.6}'/>
        <area alt="" title="" href="#Sun" coords="68,54,44" shape="circle" data-maphilight="{'strokeColor':'0000ff','strokeWidth':5,'fillColor':'00ff00','fillOpacity':0.6}"/>
    </map>
</div>
<script>
var $j = jQuery.noConflict(); 

$j(document).ready(function(){
    $j('#ImageMap1').maphilight();
});
</script>

Upvotes: 0

Views: 59

Answers (1)

safin chacko
safin chacko

Reputation: 1390

Download js files into js/themefolder/ then you can call your js files in page.xml inside head block.Those Js files will load most of your pages.

  <block type="page/html_head" name="head" as="head"> 
          <action method="addJs"><script>themefolder/jquery.js</script></action>
         <action method="addJs"><script>themefolder/yourcustom.js</script></action>

------------

Upvotes: 1

Related Questions