+ Reply to Thread
Results 1 to 7 of 7
  1. #1
    Junior Member
    Join Date
    Dec 2012
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with making a 2 image website background in Photoshop.

    Let me set by saying I am extremely new to Dreamweaver and Photoshop. I volunteered to attempt to make a website for a local organization. I'm running up against my deadline so, I'm trying to get this figured out as quickly as possible. I would appreciate any help.

    I want to create a background for the webpage. I want to have a vertical image occupying a few hundred pixels on both the left and right sides of the screen stretching from the top to the bottom.

    Between the image on the left and right sides I would like to have a fading gradient in the middle. I think I have properly created my vertical image and my fading gradient.

    How do I put the two together correctly?Thank you very much for any help. I really appreciate it.

  2. #2
    Member
    Join Date
    Sep 2012
    Posts
    36
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Re: Help with making a 2 image website background in Photoshop.

    can you explain your problem more precisely. I guess if you make a single image having the vertical images and gradient and use it as background image in html that should work. Let me know if this solves your problem.

  3. #3
    Junior Member
    Join Date
    Dec 2012
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Help with making a 2 image website background in Photoshop.

    Thanks for the reply I really appreciate it

    I've tried to explain my idea to several people and I am doing an awful job of making my vision clear. The best way I can explain is to think about drapes and a window. I would like the vertical image to be on both the left and the right side drapping down the page. Then I went to have a another image in the middle.

    I think your methodology might actually work but now that I think about it I just don't think my idea will look that good, nor would I have the skills to correct the situation if what you've explained in your post doesn't really match what I have in mind.

    I'm kind of running up against my deadline so, with my skills and my vision being rather far apart I may have to go with something else. Can anyone recommend a good way to make a unique look professional looking background using Dreamweaver and Photoshop.

  4. #4
    Junior Member
    Join Date
    Dec 2012
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Help with making a 2 image website background in Photoshop.

    Thanks for the help I was able to accomplish the background I was looking for by putting layers on top of the gradient.

  5. #5
    Member
    Join Date
    Sep 2012
    Posts
    36
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Re: Help with making a 2 image website background in Photoshop.

    good to know that your problem is solved.

  6. #6
    Junior Member
    Join Date
    Dec 2012
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Help with making a 2 image website background in Photoshop.

    Thanks for following up.


    Now I have another round of questions. I noticed that the background I created does not come close to filling the screen part of that could be because I have a 24 inch wide screen monitor.

    What should I keep in mind so that I create a background that fills the screen well in most browsers and at most resolutions? It seems like it would be a question of what canvas size to use. If so what size should I be using?

    Thanks in advance I appreciate the help.

  7. #7
    Junior Member
    Join Date
    Dec 2012
    Location
    Jaipur, Rajasthan.
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Help with making a 2 image website background in Photoshop.

    weelstb,
    try this...
    step 1. slice 1 or 2 pixel vertical line image from the background you have made in Photoshop.save it as jpg/png/gif in your folder where your website images are.

    step 2. using css element selector apply it as background image in body tag with repeat-x attribute.

    for testing use firebug addon in firefox.

 

 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
Powered by vBulletin® Version 4.1.9
Copyright © 2014 vBulletin Solutions, Inc. All rights reserved.
Content Relevant URLs by vBSEO 3.6.0
Copyright 2011 Photoshop Gurus Forum. All rights reserved.
All times are GMT -5. The time now is 07:50 PM.