1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

trouble with image page hyperlink

Discussion in 'HTML & JavaScript' started by halifax123, Nov 3, 2009.

  1. halifax123

    halifax123 Power Member

    Joined:
    Aug 5, 2008
    Messages:
    594
    Likes Received:
    66
    Location:
    uranus
    hey guys....

    I'm pretty pathetic at code (ok pathetic is a euphemism!)


    I'm trying to make an image essentially an entire page, then have it as a hyperlink.......

    since I didn't know what I was doing, I managed to get an index page to reference a folder "doc3_files" and point to image001 or image002 within that doc3_files folder(again didn't know what I was doing)( the images are identical and either one does take up the entire page and is a jpeg, or "are" jpegs) within the same domain and reference that image

    this is the code;
    Code:
    <html xmlns:v="urn:schemas-microsoft-com:vml"
    xmlns:o="urn:schemas-microsoft-com:office:office"
    xmlns:w="urn:schemas-microsoft-com:office:word"
    xmlns="http://www.w3.org/TR/REC-html40">
    
    <head>
    <meta http-equiv=Content-Type content="text/html; charset=windows-1252">
    <meta name=ProgId content=Word.Document>
    <meta name=Generator content="Microsoft Word 11">
    <meta name=Originator content="Microsoft Word 11">
    <link rel=File-List href="Doc3_files/filelist.xml">
    <link rel=Edit-Time-Data href="Doc3_files/editdata.mso">
    <!--[if !mso]>
    <style>
    v\:* {behavior:url(#default#VML);}
    o\:* {behavior:url(#default#VML);}
    w\:* {behavior:url(#default#VML);}
    .shape {behavior:url(#default#VML);}
    </style>
    <![endif]-->
    <title> </title>
    <!--[if gte mso 9]><xml>
     <o:DocumentProperties>
      <o:Author></o:Author>
      <o:Template>Normal</o:Template>
      <o:LastAuthor></o:LastAuthor>
      <o:Revision>2</o:Revision>
      <o:TotalTime>3</o:TotalTime>
      <o:Created>2009-04-26T07:05:00Z</o:Created>
      <o:LastSaved>2009-04-26T07:05:00Z</o:LastSaved>
      <o:Pages>1</o:Pages>
      <o:Characters>1</o:Characters>
      <o:Lines>1</o:Lines>
      <o:Paragraphs>1</o:Paragraphs>
      <o:CharactersWithSpaces>1</o:CharactersWithSpaces>
      <o:Version>11.9999</o:Version>
     </o:DocumentProperties>
    </xml><![endif]--><!--[if gte mso 9]><xml>
     <w:WordDocument>
      <w:SpellingState>Clean</w:SpellingState>
      <w:GrammarState>Clean</w:GrammarState>
      <w:PunctuationKerning/>
      <w:ValidateAgainstSchemas/>
      <w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>
      <w:IgnoreMixedContent>false</w:IgnoreMixedContent>
      <w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>
      <w:Compatibility>
       <w:BreakWrappedTables/>
       <w:SnapToGridInCell/>
       <w:WrapTextWithPunct/>
       <w:UseAsianBreakRules/>
       <w:DontGrowAutofit/>
      </w:Compatibility>
      <w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel>
     </w:WordDocument>
    </xml><![endif]--><!--[if gte mso 9]><xml>
     <w:LatentStyles DefLockedState="false" LatentStyleCount="156">
     </w:LatentStyles>
    </xml><![endif]-->
    <style>
    <!--
     /* Style Definitions */
     p.MsoNormal, li.MsoNormal, div.MsoNormal
    	{mso-style-parent:"";
    	margin:0in;
    	margin-bottom:.0001pt;
    	mso-pagination:widow-orphan;
    	font-size:12.0pt;
    	font-family:"Times New Roman";
    	mso-fareast-font-family:"Times New Roman";}
    @page Section1
    	{size:8.5in 11.0in;
    	margin:1.0in 1.25in 1.0in 1.25in;
    	mso-header-margin:.5in;
    	mso-footer-margin:.5in;
    	mso-paper-source:0;}
    div.Section1
    	{page:Section1;}
    -->
    </style>
    <!--[if gte mso 10]>
    <style>
     /* Style Definitions */
     table.MsoNormalTable
    	{mso-style-name:"Table Normal";
    	mso-tstyle-rowband-size:0;
    	mso-tstyle-colband-size:0;
    	mso-style-noshow:yes;
    	mso-style-parent:"";
    	mso-padding-alt:0in 5.4pt 0in 5.4pt;
    	mso-para-margin:0in;
    	mso-para-margin-bottom:.0001pt;
    	mso-pagination:widow-orphan;
    	font-size:10.0pt;
    	font-family:"Times New Roman";
    	mso-ansi-language:#0400;
    	mso-fareast-language:#0400;
    	mso-bidi-language:#0400;}
    </style>
    <![endif]-->
    </head>
    
    <body lang=EN-US style='tab-interval:.5in'>
    
    <div class=Section1>
    
    <p class=MsoNormal><!--[if gte vml 1]><v:shapetype id="_x0000_t75" coordsize="21600,21600"
     o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f"
     stroked="f">
     <v:stroke joinstyle="miter"/>
     <v:formulas>
      <v:f eqn="if lineDrawn pixelLineWidth 0"/>
      <v:f eqn="sum @0 1 0"/>
      <v:f eqn="sum 0 0 @1"/>
      <v:f eqn="prod @2 1 2"/>
      <v:f eqn="prod @3 21600 pixelWidth"/>
      <v:f eqn="prod @3 21600 pixelHeight"/>
      <v:f eqn="sum @0 0 1"/>
      <v:f eqn="prod @6 1 2"/>
      <v:f eqn="prod @7 21600 pixelWidth"/>
      <v:f eqn="sum @8 21600 0"/>
      <v:f eqn="prod @7 21600 pixelHeight"/>
      <v:f eqn="sum @10 21600 0"/>
     </v:formulas>
     <v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
     <o:lock v:ext="edit" aspectratio="t"/>
    </v:shapetype><v:shape id="_x0000_i1025" type="#_x0000_t75" style='width:768pt;
     height:675pt'>
     <v:imagedata src="Doc3_files/image001.png" o:title=""/>
    </v:shape><![endif]--><![if !vml]><img width=1024 height=900
    src="Doc3_files/image002.jpg" v:shapes="_x0000_i1025"><![endif]></p>
    
    </div>
    
    </body>
    
    </html>
    I'm trying to work with what I got, or rather what I did, and was trying to just to make the page a simple hyperlink, but my knowledge of hyperlinks is essentially "<a href="url">Link text</a> " so I didn't know how to work that into the "convaluted" scheme I created....

    I would have incorporate the image into the index page itself (if it's possible) but didn't know how to do it

    any help would be greatly appreciated!

    hali

    As Watson once said to Holmes "I haven't a clue Holmes?"
     
    Last edited: Nov 3, 2009
  2. showboytridin

    showboytridin Regular Member

    Joined:
    Sep 5, 2009
    Messages:
    348
    Likes Received:
    714
    Location:
    127.0.0.1
    You just need the follow code to do that:

    Code:
    <html>
    <head></head>
    <body>
    <a href="[COLOR=Red]http://www.yourlinkhere[/COLOR]"><img src="[COLOR=Red]Doc3_files/image002.jpg[/COLOR]"></a>
    </body>
    </html>
    
     
    • Thanks Thanks x 1
  3. halifax123

    halifax123 Power Member

    Joined:
    Aug 5, 2008
    Messages:
    594
    Likes Received:
    66
    Location:
    uranus
    hey showboy

    that worked great thanx!

    saved me years of work!!!

    Hali
     
  4. showboytridin

    showboytridin Regular Member

    Joined:
    Sep 5, 2009
    Messages:
    348
    Likes Received:
    714
    Location:
    127.0.0.1
    Yes, as you can see that 's simple. The problem is that Word generates a lot of (garbage) html code.
     
  5. halifax123

    halifax123 Power Member

    Joined:
    Aug 5, 2008
    Messages:
    594
    Likes Received:
    66
    Location:
    uranus
    I didn't realize that word did add all that code garbage!

    if I could as another question, the final product has a white "border" all the way around the edge of the page, which is visually discernable

    a white border of a few pix's and a colored "frame"(between the main portion of the page and the border) thin but visable


    since I'm trying to make a seemless transition as possible, once the page is clicked (as it is a hyperlink) it goes to the main site, which is for the most part identicle to the jpeg page I had as a hyperlink, expect the main site doesn't have the border of framed separator

    that frame makes things not line up so good (it would be nice if the border wasn't there)

    is there anyway to have the jpeg or hyperlink (depending upon how you look at it) cover the page completely? just like the black bacground of this forum runs all the way to the edge of the page?

    thanx!!!
    Hali
     
    Last edited: Nov 4, 2009
  6. showboytridin

    showboytridin Regular Member

    Joined:
    Sep 5, 2009
    Messages:
    348
    Likes Received:
    714
    Location:
    127.0.0.1
    For that you can use a table (and repeat on x axis and y axis) or a background for the body.

    Take a look for example:
    Code:
    http://www.cssdog.com/css_background-repeat.html
    The problem is put this like a link. You will need an transparent image for that.

    If you just want to remove a border:

    Code:
    <html>
    <head></head>
    <body>
    <a href="http://www.yourlinkhere"><img src="Doc3_files/image002.jpg" border="0"></a>
    </body>
    </html>
    If you have problems with margins:

    Code:
    <html>
    <head>
    <style>
    * {
        padding: 0;
        margin: 0;
        border: 0;
        }
    </style>
    </head>
    <body>
    <a href="http://www.yourlinkhere"><img src="Doc3_files/image002.jpg" border="0"></a>
    </body>
    </html>
     
  7. halifax123

    halifax123 Power Member

    Joined:
    Aug 5, 2008
    Messages:
    594
    Likes Received:
    66
    Location:
    uranus
    thank you show boy,

    that was fantastic and simple and exacting, resolving info,

    I really appreciate it, the problem is totally solved!
    and I learned from you

    thanks!
    hali