change web site background image according to the image

Page 1 of 1

2 Replies - 568 Views - Last Post: 10 April 2012 - 01:24 AM

#1 menukadevinda  Icon User is offline

  • D.I.C Regular

Reputation: -7
  • View blog
  • Posts: 470
  • Joined: 14-April 11

change web site background image according to the image

Posted 07 April 2012 - 05:00 AM

Hi all,

I think this is the suitable place to put this question.
What I want is, to develop a web site for a studio where when the image is displayed, I want to change background color. typical example is smart phone gallery application. I use a galaxy S smartphone, where when I view an image in the gallery the background of the image is change to the some faded colours of image. actually I think they take the copy of image and fade it and set it to the background.

So this is what I want to do in my web site. When the user add new image to the slide show or whatever in the site I want to change the site background as I explain in the smart phone case.

I don't like to do this using flash. since it is out of date and there are more incline on javascript.

I am a developer. If I can get a cleaer picture on what I am going to do now, that would be easy for me..
I like ur hints, comments, sujjestion and anything or exaple web template aprt fromo that I would like to write module for drupal for this.

so please help me on this.


thx in advance..............

Is This A Good Question/Topic? 0
  • +

Replies To: change web site background image according to the image

#2 sas1ni69  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 81
  • View blog
  • Posts: 430
  • Joined: 04-December 08

Re: change web site background image according to the image

Posted 07 April 2012 - 10:50 PM

You can try to change the CSS value of the background image using Javascript.
Was This Post Helpful? 1
  • +
  • -

#3 monstratonis  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 63
  • Joined: 18-April 10

Re: change web site background image according to the image

Posted 10 April 2012 - 01:24 AM

try to work on these code...

<html>
  <head>
    <style>
      #Good {
        background-repeat: no-repeat;
        background-position: center center;
        background-image: url(images/image40.gif);
      }
    </style>
    <script>
      <!--
      function changeImage() {
        newImage = "url(images/image41.gif)";
        document.getElementById('Good').style.backgroundIm  age = newImage;
      }
      //-->
    </script>
  </head>
  <body>
    <table>
      <tr>
        <td id="Good"><br>Hopefully there is a nice picture behind me :P/></td>
      </tr>
      <tr>
        <td><button onclick="changeImage()">Click Me</button><td>
    </table>
  </body>
</html>

Was This Post Helpful? 0
  • +
  • -
Page 1 of 1