javascript - Wordpress hover over link and several elements change -

-

this wordpress home page has following html content section (the middle section 3 columns of divs)

http://goodsense.etempa.co.uk

<div class="seewidgets">[widgets_on_pages id="home page middle box"]</div>  <div class="top-area">     <div class="image">         <img alt="primary care" src="/wp-content/uploads/scenarios/primary_care.png" />     </div>      <div id="contact_box" class="home_side_box">         <div class="clients">             <img alt="contact us" src="/wp-content/uploads/buttons/contact_button.png" />         </div>     </div>      <div class="home_side_box home_side_box_gap">         <div class="home_side_box_heading">social media</div>             //social media stuff         </div>          <div class="home_side_box home_side_box_gap">             <div class="home_side_box_heading">example clients</div>                 <div class="clients">                     <img alt="" src="/wp-content/themes/twentytwelve/images/client.png" />                            </div>             </div>              <div class="home_text_box" id="scenario_intro_text_div">                 <p>if work in primary healthcare know can happen. </p><p>your staff may required handle difficult ... <a href='/primary-care'>read more</a></p>             </div>         </div>     </div> </div>

as can see, there list of sectors on left, wordpress menu, central image, central text , on right, example client.

baring in mind website written in wordpress , content above entered in 'edit page' part of wordpress, not in template (although have complete access template files), can tell me way can have user hover on sector on left, , central image, central text , right hand side client image change match sector hovered over?

the main problem have list of sectors in wordpress menu , if possible, i'd stay way, can hard code if necessary.

you'll need use jquery.

this should started:

$('#menu-item-65').mouseover(function() {     // when element moused over, change html elsewhere on page     $('.top-area .image').html('<img src="path/to/your/image.jpg" />');     $('.home_side_box .clients').html('<img src="path/to/your/other/image.jpg" />');     $('#scenario_intro_text_div').html('<p>your text here</p>'); });

the first line means when #menu-item-65 (the id of 1 of individual lis left "sectors" navigation menu) mouseovered, replaces inner html of elements targeted inside function whatever specify.

relevant links:

your theme has jquery loaded, need include in custom scripts file , make sure it's loaded (either putting script call in header.php or adding via wp_enqueue_script in functions.php).


Comments

Post a Comment

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

-
using jmockit 1.2 jar, trying mock string's length method getting unexpected invocation exception: failed: test java.lang.illegalstateexception: missing invocation mocked type @ point; please make sure such invocations appear after declaration of suitable mock field or parameter @ stringdemo.testa$1.<init>(testa.java:17) @ stringdemo.testa.test(testa.java:13) i using testng: @test public void test() throws exception { new expectations() { @mocked("length") string astring; { astring.length(); result = 2; } }; system.out.println(a.showa("test")); } } actual class a: public class { public static int showa(string str){ int a= str.length(); return a; } } this wrong way of recording expected results. shouldn't mock , record string's length() method, record showa() instead. here solution @suppresswarnings("unused&qu
Read more

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

-
i have simple page in intranet uses razor/asp fetch single record table , display it, plus few graphic, dashboard display. meaning, no user intervention other first time open ie internal url. the problem having every morning ie displays "page not found or network error" message. refresh page, , it's stuck , doesn't display anything. try different pc, open ie internal url , it's stuck... ...until following: login server hosting page run inetmgr go web sites, etc right click on page that's giving me problem , select browse at moment, error message: server error in '/' application. -------------------------------------------------------------------------------- type of page not served. description: type of page have requested not served because has been explicitly forbidden. extension '.cshtml' may incorrect. please review url below , make sure spelled correctly. requested url: /application/dashboard.cshtml ---------------
Read more

c++ - wxwidget compiling on windows command prompt -

-
can please guide me on method,as how compile wxwidget using windows command prompt or msys. [i can't seem find on wxwiki/wxwidget official book/anywhere else] i have compiled wxwidget instructions have provided (using msys). from searching on internet seems 1 can (maybe?) through use of makefile (is correct?) if yes: directory & how should link wx libraries in makefile if no: way besides makefile? i know can use ide's code::block , make life simpler prefer compile using command prompt/msys. thanks in advance.
Read more