Изменить размер изображения с помощью Javascript (replicate)

Question

Хорошо, поэтому я смотрел на это более недели и не могу понять это. В основном здесь является примером конечного результата я разместил ранее:

Previous Stack Overflow Post

Их предложения не работают. Javascript меняет заголовок css, когда вы нажимаете на кнопки в верхнем правом углу. Демонстрация: DEMO of JAVASCRIPT CHANGE

Я пытаюсь дублировать это действие с изображением, но я, однако, не знаю javascript, и я не слишком уверен, что читаю, когда смотрю на файл javascript. Я либо хотел бы, чтобы кто-то помог мне прочитать этот javascript, чтобы я мог самостоятельно отредактировать его или помочь найти решение.

Вот Javascript: Script.JS

Вот соответствующий HTML, что я сделал до сих пор:

body > 
<div id="gspinner" class="spinner"></div> 
<div id="glob"> 
<header> 
    <div class="inner"> 


    <a href="#!/home"><h5><img src="images/logo_large.png" /></h5></a> 
      <!--<a href="#!/home"><img src="logo-large.png" id="img-    logo" alt="" /></a> 
      <!--<a href="#!/home"></></a>--> 

     <nav> 
      <ul> 

       <li class="li-2"><a href="#!/about"><span class="lbl">About Us</span><span class="ico -def"></span><span class="ico -hvr"></span></a> 
        <ul> 
         <li><a href="#!/history">History</a></li> 
         <li><a href="#!/mission">Mission Statement</a></li> 
         <li><a href="#!/solutions">Solutions</a></li> 
         <li><a href="#!/distribution">Distribution Area</a></li> 
         <li><a href="#!/logo">SAS Logo</a></li> 
        </ul> 
       </li> 
       <li class="li-1"><a href="#!/events"><span class="lbl">Events</span><span class="ico -def"></span><span class="ico -hvr"></span></a> 
       <ul> 
         <li><a href="#!/tradeshow">Trade Show</a></li> 
         <li><a href="#!/awesomeachievers">Awesome Achievers</a></li> 
         <li><a href="#!/whatshappening">What's Happening</a></li> 
        </ul></li> 
       <li class="li-3"><a href="#!/technology"><span class="lbl">Technology</span><span class="ico -def"></span><span class="ico -hvr"></span></a> 
       <ul> 
         <li><a href="#!/nexgen">NexGen</a></li> 
         <li><a href="#!/synergy">Synergy</a></li> 
         <li><a href="#!/edi">EDI</a></li> 
        </ul> 
       </li> 
       <li class="li-4"><a href="#!/marketing"><span class="lbl">Marketing</span><span class="ico -def"></span><span class="ico -hvr"></span></a></li> 
       <li class="li-5"><a href="#!/sales"><span class="lbl">Sales</span><span class="ico -def"></span><span class="ico -hvr"></span></a></li> 
       <li class="li-6"><a href="#!/mail"><span class="lbl">Employment</span><span class="ico -def"></span><span class="ico -hvr"></span></a></li> 
      </ul> 
     </nav> 
    </div> 
</header> 

А вот CSS: Style.css

Любая помощь будет принята с благодарностью и получит «очки» за это, я работаю над этим более недели без помощи, но я решил, что должен обратиться за помощью.

СПАСИБО!

Answer 1

Не решение для Javascript, но мне удалось добиться того, что вы хотите использовать CSS; просто добавьте «высоту: 40%» к вашему логотипу, и он должен масштабироваться с заголовком (обратите внимание, что вам, вероятно, понадобится использовать более качественную версию логотипа), так как текущий становится немного пиксельным, когда он растет ,