Results 1 to 3 of 3

Thread: var image pathways

  1. #1
    Join Date
    Feb 2014
    Location
    ky
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Cool var image pathways

    I have a lot of images with long paths in the <img> statements. I wanted to put the pathway (which is usually the same) into a a var to clean up my code. The obvious approach (to me ) didn't work. How do i do it?

  2. #2
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default

    Quote Originally Posted by maddoccanis View Post
    The obvious approach (to me ) didn't work.
    And what is "the obvious approach"? You need to describe what you did, and what actually happened (vs. what you expected to happen). Showing us the code you're working with is always helpful as well.

    Also, this is not a question about graphics: what programming language are you using? My guess would be javascript, but let me know and I'll move your thread to the appropriate forum.

    If it's javascript, you assign a variable with the assignment operator ( = ). The var keyword and the variable name go on the left, and the value goes on the right, like so:
    Code:
    var nameOfMyVar = "value of my var";
    Your question is unclear.
    Please provide more information, and be as specific as possible.
    • What do you want to accomplish?
    • What have you already tried?
    • What problems did you encounter?

    Please be sure that you have included all relevant code and/or a link to the page in question.
    You might also consider making a reduced test case using an online tool like jsfiddle


    Edit: Is this related to your other thread? If you're still working on the same problem, there's no need to start a new thread.

    We still need more information, but here's an example of a pattern you might follow:
    Code:
    // put all of your image paths into an array
    var paths = [
        "path/to/img-1.png",
        "path/to/img-2.png",
        //  etc.
    ];
    
    // choose where you will insert the images on your html page
    var parentElement = document.getElementById( "id-of-element-which-new-imgs-should-be-inserted-inside" );
    
    // loop through each image path; for each path:
    for( i=0; i<paths.length; i++ ){
    
        // create a new image element
        var img = document.createElement( "img" );
    
        // set the new image's src attribute to the desired path
        img.src = "http://example.com/" + paths[i];
    
        // insert the new image into the html page.
        parentElement.appendChild( img );
    }
    Last edited by traq; 02-16-2014 at 10:25 PM.

  3. #3
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,940
    Thanks
    16
    Thanked 304 Times in 303 Posts
    Blog Entries
    11

    Default

    You might be better using PHP in case visitors have JavaScript turned off. Since PHP is server-side, it would also avoid any unnecessary flashes while JavaScript takes a moment to write the image paths and loads them in.

    Same type of setup;
    Code:
    <?php $path = '/path/to/img/folder/';?>
    
    <img src="<?php echo $path;?>pic1.jpg" />
    <img src="<?php echo $path;?>pic2.jog" />
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

Similar Threads

  1. Replies: 1
    Last Post: 05-31-2013, 09:57 PM
  2. Replies: 5
    Last Post: 05-23-2011, 06:53 AM
  3. image thumbnail viewer II (set image sizes, default image)
    By ramtanion in forum Dynamic Drive scripts help
    Replies: 7
    Last Post: 05-07-2008, 12:26 AM

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
  •