Results 1 to 10 of 10

Thread: Help needed - How to apply styles to onMouseover text descriptions

  1. #1
    Join Date
    Feb 2012
    Location
    London
    Posts
    24
    Thanks
    13
    Thanked 2 Times in 2 Posts

    Default Help needed - How to apply styles to onMouseover text descriptions

    Hello,
    I am building a CSS hover menu with onMouseover text descriptions, originally taken from [url[http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm[/url].

    I would like to style the text that appears onMouseover, but I have no javascript experience. I have used my CSS styling knowledge and come up with this:

    Code:
    <a href="smith1.html" onmouseover="MM_swapImage('LGImg','','br1.jpg',1),showtext(' <p>Feminist Icons, 2011<br />A series of lithographs,<br /><i>Edition of 35</i></p>')" title="Click here"><img src="br1t.jpg" alt="" width="70" height="87" id="smith" /></a>
    I would love some feedback; Is this correct, the way I have added the styling within the javascript code?
    I look forward to hearing from someone.
    With kind regards
    Frankie
    Last edited by FrankieL; 02-21-2012 at 12:06 AM. Reason: links deleted so put code into post instead

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    both of your links are broken
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  3. #3
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    you have spare " characters in your code

    use

    Code:
    <li><a href="news.html" onmouseover="MM_swapImage('LGImg','','http://www.siteremoved.com/test/assets/news/MechanicalHandcover.jpg',1),showtext('<p>News: New book<br /><em>The Mechanical Hand</em></p>')"  title="News: New book"><img src="http://www.siteremoved.com/test/assets/home_news/MechanicalHandcover1t.jpg" alt="" width="70" height="85" id="Book" /></a></li>
    
    <li><a href="news.html" onmouseover="MM_swapImage('LGImg','','http://www.siteremoved.com/test/assets/chambers/Trouble/_MG_9630.jpg',1),showtext('<p>News: <em>The London Original Print Fair 2012</em><br />Royal Academy of Arts<br /><i>Tuesday 19 - Sunday 22 April 2012</i></p>')"  title="News: Print Fair 2012"><img src="http://www.siteremoved.com/test/assets/chambers/Trouble/_MG_9630t.jpg" alt="" width="70" height="78" id="Fair" /></a></li>
    
    <li><a href="publications/Chambers.html" onmouseover="MM_swapImage('LGImg','','http://www.siteremoved.com/test/assets/chambers/Trouble/_MG_9613.jpg',1),showtext('<p>Publications: New work<br /><em>Stephen Chambers</em><br />Trouble Meets Trouble</p>')"  title="Publications: Stephen Chambers"><img src="http://www.siteremoved.com/test/assets/chambers/Trouble/_MG_9613t.jpg" alt="" width="70" height="78" id="Chambers" /></a></li>
    
    <li><a href="AIPP.html" onmouseover="MM_swapImage('LGImg','','http://www.siteremoved.com/test/assets/home_news/news_AIPP.jpg',1),showtext('<p>International: <em>Summer school</em><br />Dordogne, France<br /><i>23rd – 27th July 2012</i></p>')"  title="International: Summer school"><img src="http://www.siteremoved.com/test/assets/home_news/news_AIPPt.jpg" alt="" width="70" height="85" id="aipp" /></a></li>
    
    <li><a href="news.html" onmouseover="MM_swapImage('LGImg','','http://www.siteremoved.com/test/assets/home_news/TraceyEmin.jpg',1),showtext('<p>News: Exhibition<br /><em>The Mechanical Hand</em><br /><i>Kings Place Gallery<br />Fri 27th Apr - Fri 22nd Jun 2012</i></p>')"  title="News: Exhibition"><img src="http://www.siteremoved.com/test/assets/home_news/TraceyEmint.jpg" alt="" width="92" height="65" id="Exhibition" /></a></li>
    you can put HTML code in your swap text code, what additional styling do you require
    Last edited by jscheuer1; 06-26-2012 at 04:04 AM. Reason: op requested site name removal
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  4. The Following User Says Thank You to vwphillips For This Useful Post:

    FrankieL (02-18-2012)

  5. #4
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Is this also a correction you have done;
    no this was for me to test the code

    also the height=auto of the main image prevents it displaying with IE
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  6. #5
    Join Date
    Feb 2012
    Location
    London
    Posts
    24
    Thanks
    13
    Thanked 2 Times in 2 Posts

    Default HTML code in the swap text code not validating

    Dear vwphillips,

    you can put HTML code in your swap text code, what additional styling do you require
    You have said that it is okay to put HTML code in the swap text code, but the page not validating. The errors are saying the HTML code in the swap text code is wrong.


    Please could you help. Thank you so much!
    Last edited by jscheuer1; 04-08-2012 at 03:58 PM. Reason: user request

  7. #6
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    you can get rid of those validate errors by

    in the javascript

    Code:
    var quotes=[
    '<p>News:<br /><em>The Mechanical Hand</em><br /><b>New book</b> out March 2012</p>',
    '<p>News:<br /><em>The Mechanical Hand</em><br />Exhibition at the <b>Kings Place Gallery<b><br /><i>Fri 27th Apr - Fri 22nd Jun 2012</i></p>',
    '<p>News:<br /><em>The London Original Print Fair 2012</em><br /><b>Paupers Press</b> to launch new publications<br /><i>Royal Academy of Arts, 19 - 22 April 2012</i></p>',
    '<p>Publications:<br /><em>Trouble Meets Trouble</em><br /><b>New work</b> by Stephen Chambers</p>',
    '<p>International:<br /><em>Summer school 2012</em><br />Book now<br /><i>St. Avit, Dordogne, France, 23rd – 27th July</i></p>'
    ]
    and the HTML

    Code:
    <a href="news.html" onmouseover="MM_swapImage('LGImg','','assets/home_news/MHcoverX.jpg',1),showtext(quotes[0])" title="News: New book"><img src="http://www.siteremoved.com/test/assets/home_news/MHcoverXt.jpg" alt="" width="70" height="78" id="Book" /></a>
    
    <a href="news.html#exhb" onmouseover="MM_swapImage('LGImg','','assets/home_news/TEmin.jpg',1),showtext(quotes[1])" title="News: Exhibition"><img src="assets/home_news/TEmint.jpg" alt="" width="70" height="78" id="Exhibition" /></a>
    
    <a href="news.html#fair" onmouseover="MM_swapImage('LGImg','','assets/chambers/Trouble/_MG_9630.jpg',1),showtext(quotes[2])" title="News: Print Fair 2012"><img src="assets/chambers/Trouble/_MG_9630t.jpg" alt="" width="70" height="78" id="Fair" /></a>
    
    <a href="publications/Chambers.html" onmouseover="MM_swapImage('LGImg','','assets/chambers/Trouble/_MG_9613.jpg',1),showtext(quotes[3])" title="Publications: Stephen Chambers"><img src="assets/chambers/Trouble/_MG_9613t.jpg" alt="" width="70" height="78" id="Chambers" /></a>
    
    <a href="AIPP.html" onmouseover="MM_swapImage('LGImg','','assets/home_news/aipp.jpg',1),showtext(quotes[4])" title="International: Summer school"><img src="assets/home_news/aippt.jpg" alt="" width="70" height="78" id="aipp" /></a>
    but you have other problems with validation and your javascript
    I will try and look at your javascript later

    consider

    Code:
    function showtext(thetext){
     var obj=document.getElementById("imgInfo");
     obj.innerHTML=thetext;
     gradualfade(obj,0,10);
    }
    
    function hidetext(){
     document.getElementById("imgInfo").innerHTML='';
    }
    
    function cleartimer(){
     clearTimeout(gradualfade.to);
    }
    
    function gradualfade(obj,opc,i){
     cleartimer();
     if (opc<100){
      zxcOpacity(obj,opc);
      opc+=i;
      gradualfade.to=setTimeout(function(){ gradualfade(obj,opc,i); },50)
     }
     else {
      zxcOpacity(obj,100);
    
     }
    }
    
    function zxcOpacity(obj,opc){
     obj.style.filter='alpha(opacity='+opc+')';
     obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
    }
    Last edited by jscheuer1; 06-26-2012 at 04:05 AM. Reason: see previous post edit
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  8. The Following User Says Thank You to vwphillips For This Useful Post:

    FrankieL (02-23-2012)

  9. #7
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Paupers Press: artists print &amp; book projects</title>
    
    <meta name="robots" content="none" />
    <meta name="Keywords" xml:lang="en" content="Paupers press and publications, Hoxton, London, printmaking, Damien Hirst, Paula Rego, Rachel Whitread, Cornellia Parker, Jake &amp; Dinos Chapman, Tony Bevan, Grayson Perry, Glenn Brown, Mat Collishaw, Chris Ofili, Rosie Snell, Stephen Chambers, Hughie O'Donoghue, Chris Le Brun, Elizabeth Magill, Sue Webster &amp; Tim Noble, Tracey Emin, Keith Coventry, Allesandro Raho, Jock McFadyen, Eileen Cooper, Andrejz Jackowski, Catharine Yass, Jenny Saville, Richard Wathern, Craigie Aitchison, Charles Avery, Gavin Turk" />
    <meta name="Description" xml:lang="en" content="The Paupers Press in Hoxton, London, is a fine art print and publishing studio with facilities for etching, lithography, silkscreen and relief printing." />
    <meta name="copyright" content="Paupers Press. All rights reserved."/>
    <meta name="designer" content="Designed and Built by Francoise Lacroix. Email francoise300(at)gmail.com" />
    
    <link href="http://siteremoved.com/test/_css/style.css" rel="stylesheet" type="text/css" />
    <!--[if IE 6]><link href="http://siteremoved.com/test/_css/ie6.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    <!--[if IE 7]><link href="http://siteremoved.com/test/_css/ie7.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    <!--[if IE 8]><link href="http://siteremoved.com/test/_css/ie8.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <script  type="text/javascript">
    
    <!--Standard Dreamweaver mouseover script-->
    <!--
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    
    
    <!--javascript from http://www.javascriptkit.com/javatutors/crossmenu2.shtml for info appearing below image-->
    var quotes=[
    '<p>News:<br /><em>The Mechanical Hand</em><br /><b>New book</b> out March 2012</p>',
    '<p>News:<br /><em>The Mechanical Hand</em><br />Exhibition at the <b>Kings Place Gallery<b><br /><i>Fri 27th Apr - Fri 22nd Jun 2012</i></p>',
    '<p>News:<br /><em>The London Original Print Fair 2012</em><br /><b>Paupers Press</b> to launch new publications<br /><i>Royal Academy of Arts, 19 - 22 April 2012</i></p>',
    '<p>Publications:<br /><em>Trouble Meets Trouble</em><br /><b>New work</b> by Stephen Chambers</p>',
    '<p>International:<br /><em>Summer school 2012</em><br />Book now<br /><i>St. Avit, Dordogne, France, 23rd – 27th July</i></p>'
    ];
    
    function showtext(thetext){
     var obj=document.getElementById("imgInfo");
     obj.innerHTML=thetext;
     gradualfade(obj,0,10);
    }
    
    function hidetext(){
     document.getElementById("imgInfo").innerHTML='';
    }
    
    function cleartimer(){
     clearTimeout(gradualfade.to);
    }
    
    function gradualfade(obj,opc,i){
     cleartimer();
     if (opc<100){
      zxcOpacity(obj,opc);
      opc+=i;
      gradualfade.to=setTimeout(function(){ gradualfade(obj,opc,i); },50)
     }
     else {
      zxcOpacity(obj,100);
    
     }
    }
    
    function zxcOpacity(obj,opc){
     obj.style.filter='alpha(opacity='+opc+')';
     obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
    }
    
    </script>
    
    </head>
    
    <body id="index">
    <div id="container">
      <div id="header">
    
    <div id="mainNav">
    <ul>
    <li><a class="on" href="index.html" title="Paupers Press">Home</a></li>
    <li><a href="studio.html" title="Paupers Press studio">Studio</a></li>
    
    <li><a href="publications.html" title="Paupers Press publications">Publications</a></li>
    <li><a href="projects.html">Projects</a></li>
    <li><a href="AIPP.html" title="Work on projects abroad">International</a></li>
    <li><a href="news.html" title="Print Fairs, exhibitions">News</a></li>
    <li><a href="contact.html" title="Contact details and map">Contact</a></li>
    </ul>
    </div><!-- /#mainNav -->
    
    <div id="logo"><h1><a href="index.html" ><img src="logo.png" alt="Paupers Press and Publications" width="330" height="19"/></a></h1></div><!-- /#logo -->
    </div><!-- /#header -->
    
    <div id="subNav"><p>&nbsp;</p></div>
    
    <div id="content">
    
    <div class="row">
      <div class="col gu2">
        <p>The Paupers Press is a fine art print and publishing studio that works with many leading contemporary artists, publishers and galleries. The studio, based in Hoxton, London, was opened in 1986.</p>
       <p>Using hand drawn, photographic and digital material, artists can explore their work within all that etching, lithography and relief printing can offer.</p>
        <p>Artists include:<br />
    Damien Hirst, Paula Rego, Rachel Whitread, Cornellia Parker, Jake &amp; Dinos Chapman, Tony Bevan, Grayson Perry, Glenn Brown, Mat Collishaw, Chris Ofili, Rosie Snell, Stephen Chambers, Hughie O'Donoghue, Chris Le Brun, Elizabeth Magill, Sue Webster &amp; Tim Noble, Tracey Emin, Keith Coventry, Allesandro Raho, Jock McFadyen, Eileen Cooper, Andrejz Jackowski, Catharine Yass, Jenny Saville, Richard Wathern, Craigie Aitchison, Charles Avery, Gavin Turk</p>
    
      </div><!-- /.col gu -->
    
      <div class="col gu2">
    <img src="http://siteremoved.com/test/assets/home_news/MHcoverX.jpg" alt="" id="LGImg"/>
      <div id="imgInfo">
      <p>News:<br /><em>The Mechanical Hand</em><br /><b>New book</b> out March 2012</p>
      </div><!-- /imgInfo -->
    
    </div><!-- /.col gu2 -->
    
      <div class="col gu1 thumbs2rows">
    
      <a href="news.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/MHcoverX.jpg',1),showtext(quotes[0])" title="News: New book"><img src="http://www.siteremoved.com/test/assets/home_news/MHcoverXt.jpg" alt="" width="70" height="78" id="Book" /></a>
    
    <a href="publications/Chambers.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/chambers/Trouble/_MG_9630.jpg',1),showtext(quotes[1])" title="Publications: Stephen Chambers"><img src="http://siteremoved.com/test/assets/chambers/Trouble/_MG_9630t.jpg" alt="" width="70" height="78" id="Chambers" /></a>
    
    <a href="news.html#fair" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/litho1.jpg',1),showtext(quotes[2])" title="News: Print Fair 2012"><img src="http://siteremoved.com/test/assets/home_news/litho1t.jpg" alt="" width="70" height="78" id="Fair" /></a>
    <a href="news.html#exhib" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/TEmin.jpg',1),showtext(quotes[3])" title="News: Exhibition"><img src="http://siteremoved.com/test/assets/home_news/TEmint.jpg" alt="" width="70" height="78" id="Exhibition" /></a>
    
    
    
    <a href="AIPP.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/aipp.jpg',1),showtext(quotes[4])" title="International: Summer school"><img src="http://siteremoved.com/test/assets/home_news/aippt.jpg" alt="" width="70" height="78" id="aipp" /></a>
    
    
    
    </div> <!-- /.col gu1 thumbs2rows -->
      </div><!-- /.row -->
      <div class="clear"></div>
    </div>
    <!-- /#content -->
    
    <div id="footer">
    <div id="right">
    <p>Copyright &copy; 2011 the artists and Paupers Press</p>
    <p><a href="legal_info.html">Legal &amp; Info</a><a href="sitemap.html">Site Map</a></p></div>
    
    <div id="left">
    
    <div id="subscribe">
    <form action="http://cgi.uk2.net/cgi-bin/uk2-formmail.pl" method="post">
    <input type="hidden" name="recipient" value="info@siteremoved.com"/>
    <input type="hidden" name="redirect" value="http://www.siteremoved.com/FormMail/thanks.html"/>
    <input type="hidden" name="env_report" value="REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT"/><!-- do not change this line -->
    <input type="hidden" name="print_config" value="email"/>
    <input type="hidden" name="required" value="email"/>
    <input type="hidden" name="print_blank_fields" value="1"/>
    <label class="text" for="newsletter_email">Subscribe to our Mailing List:</label>
    <input type="text" size="35" name="email" value="Enter your email address" title="Enter your email address" id="newsletter_email" onfocus="value=''"/>
    <input type="submit" value="Join" class="submit"/>
    </form>
    </div><!-- /#subscribe -->
    
    <p>Paupers Press, 45 Coronet Street, Hoxton, London, N1 6HD, UK <span>tel: +44 (0)20 7729 5272</span></p>
    </div>
    </div><!-- /#footer -->
    </div>
    <!-- /#container -->
    </body>
    </html>
    you had missed the quote array
    Last edited by jscheuer1; 06-26-2012 at 04:07 AM. Reason: see previous
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  10. #8
    Join Date
    Feb 2012
    Location
    London
    Posts
    24
    Thanks
    13
    Thanked 2 Times in 2 Posts

    Default

    Great, thank you, but now it is not validating.

  11. #9
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Paupers Press: artists print &amp; book projects</title>
    
    <meta name="robots" content="none" />
    <meta name="Keywords" xml:lang="en" content="Paupers press and publications, Hoxton, London, printmaking, Damien Hirst, Paula Rego, Rachel Whitread, Cornellia Parker, Jake &amp; Dinos Chapman, Tony Bevan, Grayson Perry, Glenn Brown, Mat Collishaw, Chris Ofili, Rosie Snell, Stephen Chambers, Hughie O'Donoghue, Chris Le Brun, Elizabeth Magill, Sue Webster &amp; Tim Noble, Tracey Emin, Keith Coventry, Allesandro Raho, Jock McFadyen, Eileen Cooper, Andrejz Jackowski, Catharine Yass, Jenny Saville, Richard Wathern, Craigie Aitchison, Charles Avery, Gavin Turk" />
    <meta name="Description" xml:lang="en" content="The Paupers Press in Hoxton, London, is a fine art print and publishing studio with facilities for etching, lithography, silkscreen and relief printing." />
    <meta name="copyright" content="Paupers Press. All rights reserved."/>
    <meta name="designer" content="Designed and Built by Francoise Lacroix. Email francoise300(at)gmail.com" />
    
    <link href="http://siteremoved.com/test/_css/style.css" rel="stylesheet" type="text/css" />
    <!--[if IE 6]><link href="http://siteremoved.com/test/_css/ie6.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    <!--[if IE 7]><link href="http://siteremoved.com/test/_css/ie7.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    <!--[if IE 8]><link href="http://siteremoved.com/test/_css/ie8.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
    
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <script  type="text/javascript">
    /*<![CDATA[*/
    
    //--Standard Dreamweaver mouseover script-->
    /function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    
    
    //javascript from http://www.javascriptkit.com/javatutors/crossmenu2.shtml for info appearing below image-->
    var quotes=[
    '<p>News:<br /><em>The Mechanical Hand</em><br /><b>New book</b> out March 2012</p>',
    '<p>News:<br /><em>The Mechanical Hand</em><br />Exhibition at the <b>Kings Place Gallery<b><br /><i>Fri 27th Apr - Fri 22nd Jun 2012</i></p>',
    '<p>News:<br /><em>The London Original Print Fair 2012</em><br /><b>Paupers Press</b> to launch new publications<br /><i>Royal Academy of Arts, 19 - 22 April 2012</i></p>',
    '<p>Publications:<br /><em>Trouble Meets Trouble</em><br /><b>New work</b> by Stephen Chambers</p>',
    '<p>International:<br /><em>Summer school 2012</em><br />Book now<br /><i>St. Avit, Dordogne, France, 23rd – 27th July</i></p>'
    ];
    
    function showtext(thetext){
     var obj=document.getElementById("imgInfo");
     obj.innerHTML=thetext;
     gradualfade(obj,0,10);
    }
    
    function hidetext(){
     document.getElementById("imgInfo").innerHTML='';
    }
    
    function cleartimer(){
     clearTimeout(gradualfade.to);
    }
    
    function gradualfade(obj,opc,i){
     cleartimer();
     if (opc<100){
      zxcOpacity(obj,opc);
      opc+=i;
      gradualfade.to=setTimeout(function(){ gradualfade(obj,opc,i); },50)
     }
     else {
      zxcOpacity(obj,100);
    
     }
    }
    
    function zxcOpacity(obj,opc){
     obj.style.filter='alpha(opacity='+opc+')';
     obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body id="index">
    <div id="container">
      <div id="header">
    
    <div id="mainNav">
    <ul>
    <li><a class="on" href="index.html" title="Paupers Press">Home</a></li>
    <li><a href="studio.html" title="Paupers Press studio">Studio</a></li>
    
    <li><a href="publications.html" title="Paupers Press publications">Publications</a></li>
    <li><a href="projects.html">Projects</a></li>
    <li><a href="AIPP.html" title="Work on projects abroad">International</a></li>
    <li><a href="news.html" title="Print Fairs, exhibitions">News</a></li>
    <li><a href="contact.html" title="Contact details and map">Contact</a></li>
    </ul>
    </div><!-- /#mainNav -->
    
    <div id="logo"><h1><a href="index.html" ><img src="logo.png" alt="Paupers Press and Publications" width="330" height="19"/></a></h1></div><!-- /#logo -->
    </div><!-- /#header -->
    
    <div id="subNav"><p>&nbsp;</p></div>
    
    <div id="content">
    
    <div class="row">
      <div class="col gu2">
        <p>The Paupers Press is a fine art print and publishing studio that works with many leading contemporary artists, publishers and galleries. The studio, based in Hoxton, London, was opened in 1986.</p>
       <p>Using hand drawn, photographic and digital material, artists can explore their work within all that etching, lithography and relief printing can offer.</p>
        <p>Artists include:<br />
    Damien Hirst, Paula Rego, Rachel Whitread, Cornellia Parker, Jake &amp; Dinos Chapman, Tony Bevan, Grayson Perry, Glenn Brown, Mat Collishaw, Chris Ofili, Rosie Snell, Stephen Chambers, Hughie O'Donoghue, Chris Le Brun, Elizabeth Magill, Sue Webster &amp; Tim Noble, Tracey Emin, Keith Coventry, Allesandro Raho, Jock McFadyen, Eileen Cooper, Andrejz Jackowski, Catharine Yass, Jenny Saville, Richard Wathern, Craigie Aitchison, Charles Avery, Gavin Turk</p>
    
      </div><!-- /.col gu -->
    
      <div class="col gu2">
    <img src="http://siteremoved.com/test/assets/home_news/MHcoverX.jpg" alt="" id="LGImg"/>
      <div id="imgInfo">
      <p>News:<br /><em>The Mechanical Hand</em><br /><b>New book</b> out March 2012</p>
      </div><!-- /imgInfo -->
    
    </div><!-- /.col gu2 -->
    
      <div class="col gu1 thumbs2rows">
    
      <a href="news.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/MHcoverX.jpg',1),showtext(quotes[0])" title="News: New book"><img src="http://www.siteremoved.com/test/assets/home_news/MHcoverXt.jpg" alt="" width="70" height="78" id="Book" /></a>
    
    <a href="publications/Chambers.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/chambers/Trouble/_MG_9630.jpg',1),showtext(quotes[1])" title="Publications: Stephen Chambers"><img src="http://siteremoved.com/test/assets/chambers/Trouble/_MG_9630t.jpg" alt="" width="70" height="78" id="Chambers" /></a>
    
    <a href="news.html#fair" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/litho1.jpg',1),showtext(quotes[2])" title="News: Print Fair 2012"><img src="http://siteremoved.com/test/assets/home_news/litho1t.jpg" alt="" width="70" height="78" id="Fair" /></a>
    <a href="news.html#exhib" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/TEmin.jpg',1),showtext(quotes[3])" title="News: Exhibition"><img src="http://siteremoved.com/test/assets/home_news/TEmint.jpg" alt="" width="70" height="78" id="Exhibition" /></a>
    
    
    
    <a href="AIPP.html" onmouseover="MM_swapImage('LGImg','','http://siteremoved.com/test/assets/home_news/aipp.jpg',1),showtext(quotes[4])" title="International: Summer school"><img src="http://siteremoved.com/test/assets/home_news/aippt.jpg" alt="" width="70" height="78" id="aipp" /></a>
    
    
    
    </div> <!-- /.col gu1 thumbs2rows -->
      </div><!-- /.row -->
      <div class="clear"></div>
    </div>
    <!-- /#content -->
    
    <div id="footer">
    <div id="right">
    <p>Copyright &copy; 2011 the artists and Paupers Press</p>
    <p><a href="legal_info.html">Legal &amp; Info</a><a href="sitemap.html">Site Map</a></p></div>
    
    <div id="left">
    
    <div id="subscribe">
    <form action="http://cgi.uk2.net/cgi-bin/uk2-formmail.pl" method="post">
    <input type="hidden" name="recipient" value="info@siteremoved.com"/>
    <input type="hidden" name="redirect" value="http://www.siteremoved.com/FormMail/thanks.html"/>
    <input type="hidden" name="env_report" value="REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT"/><!-- do not change this line -->
    <input type="hidden" name="print_config" value="email"/>
    <input type="hidden" name="required" value="email"/>
    <input type="hidden" name="print_blank_fields" value="1"/>
    <label class="text" for="newsletter_email">Subscribe to our Mailing List:</label>
    <input type="text" size="35" name="email" value="Enter your email address" title="Enter your email address" id="newsletter_email" onfocus="value=''"/>
    <input type="submit" value="Join" class="submit"/>
    </form>
    </div><!-- /#subscribe -->
    
    <p>Paupers Press, 45 Coronet Street, Hoxton, London, N1 6HD, UK <span>tel: +44 (0)20 7729 5272</span></p>
    </div>
    </div><!-- /#footer -->
    </div>
    <!-- /#container -->
    </body>
    </html>
    Last edited by jscheuer1; 06-26-2012 at 04:08 AM. Reason: see previous
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  12. #10
    Join Date
    Feb 2012
    Location
    London
    Posts
    24
    Thanks
    13
    Thanked 2 Times in 2 Posts

    Default

    Hello Vic,
    That has got it validating but now it's not working - the text below the image doesn't change with the images.
    Would you please be able to take a look again?


    Thank you
    Last edited by jscheuer1; 06-26-2012 at 04:08 AM. Reason: user request

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •