Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Posts
    1
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Trying to display image using document.write

    Filename: front.htm
    Supporting files: ads1.jpg - ads5.jpg, ads.js, fp.jpg, front.htm, logo.jpg, random.js,
    styles.css
    -->
    <title>The Ridgewood Herald Tribune</title>
    <link href="styles.css" rel="stylesheet" type="text/css" />

    <script src="random.js" type="text/javascript"></script>

    <script src="ads.js" type="text/javascript"></script>
    </head>

    <body>

    <div id="links">
    <h1>Contents</h1>
    <p class="section">Main</p>
    <p class="linksub">
    <a href="#">Home</a><br />
    <a href="#">Subscriptions</a><br />
    <a href="#">Contact Us</a><br />
    <a href="#">News Sources</a><br /><br />
    </p>
    <p class="section">News</p>
    <p class="linksub">
    <a href="#">Local</a><br />
    <a href="#">National</a><br />
    <a href="#">International</a><br />
    </p>

    <p class="section">Sports</p>
    <p class="linksub">
    <a href="#">Baseball</a><br />
    <a href="#">Basketball</a><br />
    <a href="#">Football</a><br />
    <a href="#">Golf</a><br />
    <a href="#">Hockey</a><br />
    <a href="#">Miscellaneous</a><br />
    </p>

    <p class="section">Opinion</p>
    <p class="linksub">
    <a href="#">Editorials</a><br />
    <a href="#">Columnists</a><br />
    <a href="#">Letters</a><br />
    </p>

    <p class="section">Classifieds</p>
    <p class="linksub">
    <a href="#">Employment</a><br />
    <a href="#">For Sale</a><br />
    <a href="#">Personals</a><br />
    <a href="#">Real Estate</a><br />
    <a href="#">Wanted</a><br />
    </p>

    <p class="section">Other</p>
    <p class="linksub">
    <a href="#">Business</a><br />
    <a href="#">Weather</a><br />
    <a href="#">Entertainment</a>
    </p>
    </div>

    <div id="main">
    <div id="ads">
    <script type="text/javascript">
    /*
    generate a random integer from 1 to 5
    */
    var rNumber = randInt(5);

    /*
    description of the random ad
    */
    var rAd = adDescription(rNumber);

    /*
    URL of the random ad
    */
    var rLink = adLink(rNumber);

    document.write('<a href="'+rLink+'">');
    document.write(rLink+"'ads'"+rNumber+"'.jpg'" alt="'rAd'" />);
    document.write(adLink);
    document.write("</a>");
    </script>

    </div>

    <div id="request"><a href="#">Contact us today to place your ad</a></div>

    <p id="logo">
    <img src="logo.jpg" alt="Ridgewood Herald Tribune" />
    </p>

    <p id="fp">
    <img src="fp.jpg" alt="" />
    </p>

    <h2>Park Opens</h2>
    <p id="intro">The <i>Adventure Island</i> theme park opened its doors on
    Monday near Ridgewood. The park, one of the biggest in New Jersey, drew
    large crowds, but the long lines didn't deter anyone. "I've been watching
    them put up the rides over the last year, it's really exciting to finally
    get inside the gates!" said Ridgewood resident, Denise Brooks.</p>

    <p class="cont"><a href="#">story continues on page 2...</a></p>

    <address id="footer">
    <b>Ridgewood Herald Tribune</b> &nbsp;&#176;&nbsp; 10010 Atwood Ave.
    &nbsp;&#176;&nbsp; Ridgewood, NJ &nbsp; &nbsp; 07451<br />
    Phone: (201)555-1101 &nbsp;&#176;&nbsp; Fax: (201)555-1102
    </address>
    </div>

    </body>
    </html>
    Last edited by jstewart157; 01-15-2012 at 12:59 AM. Reason: needed more information

  • #2
    New Coder
    Join Date
    Jan 2012
    Posts
    32
    Thanks
    0
    Thanked 1 Time in 1 Post
    is your code as you have it here or is there more to it but you are only showing the part you thing is causing the page to fail ?

    its just that you have unclosed divs

    also can you give us a few examples of the acutal file names of the images.

    I suspect you have the single quotes in the wrong place, but need to know the file names first.
    Last edited by FreelanceCoder; 01-15-2012 at 12:20 AM.

  • Users who have thanked FreelanceCoder for this post:

    jstewart157 (01-15-2012)

  • #3
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,620
    Thanks
    0
    Thanked 645 Times in 635 Posts
    Instead of:

    Code:
    <div id="ads"></div>
    and then link an external JavaScript just before the </body> tag containiing the following:

    Code:
    (function(adDescription, adLink) {
     var rNumber = randInt(5);
     var rAd = adDescription(rNumber);
     var rLink = adLink(rNumber);
    
     document.getElementById('ads').innerHTML = '<a href="'+rLink+'"><img src="' +
         rLink+'ads'+rNumber+'.jpg" alt="'+rAd+'"/>'+adLink+<\/a>';
    })(adDescription, adLink);
    The quotes in your antiquated document.write statements were mismatched as well as missing the img tag which is why they didn't work (also something else in the page might have been interfering as that version of the code is easily interfered with unlike this version which is almost completely unobtrusive and only relies on the id and the two arrays to exist in order for it to work).
    Last edited by felgall; 01-15-2012 at 04:16 AM.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    jstewart157 (01-15-2012)


  •  

    Posting Permissions

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