CODEWITHSUNDEEP
javascript
user2963724
user2963724

Reputation:

How do i add an image in a div?

I need to insert a image to be zoom in and out but some website told me that it is suppose to be use with path="image url". The image didn't appear so i want to use background-image: url("image url"). So how do i put it in to allow image to show? 

<style type="text/css">

#html{
    height:100%;
}

#body{
    height:100%;
    margin:0px;
    padding:0px;

}

#hr{ 
    border:0;
    width:50%;
}


</style>


<body>


<div id="outerDiv0">
  <div id="outerDiv" style="position:relative;height:99%;width:100%;border:1px solid black;overflow:hidden;">


    <div style="position: absolute; top: 10px; left: 10px; z-index: 1">
      <img src="zoomin_off.gif"
           onclick="ZoomIn()" alt="zoomin"/>
    </div>
<div style="position: absolute; top: 10px; left: 90px; z-index: 1">
      <img src="zoomout_off.gif"
           onclick="ZoomOut()" alt="zoomout"/>
    </div>

    <div id="Nav" style="display:none;position: absolute; top: 70px; left: 20px; z-index: 1"><div><a href="javascript:slidePrev();" id="slidePrev"><img src="prev.gif" alt="prev"/></a></div>
<div style="position: absolute; top: 0px; left: 79px;"><a href="javascript:slideNext();" id="slideNext"><img src="next.gif" alt="next"/></a></div></div>

    <div id="imageTiles" style="position:relative;top:0;left:0;z-index:0;width:100%;"></div>
    <div id="imageLabels" style="position:relative;top:0;left:0;z-index:1;width:900000px;height:900000px;"></div>
    </div>

  <div id="overlay"><div id="theScale"></div><div id="theInfo">
  </div>
  <div id="Thumb0"><div id="Thumb"></div><div id="Thumb2"></div></div>
  </div>

  <div id="wheelMode">Mouse Wheel:<input type="radio" onclick="wheelMode1()"          />&nbsp;Zoom<input type="radio" onclick="wheelMode2()" />&nbsp;Next/Prev</div>
  <div id="coords" style="position:absolute;top:2px;right:10px;z-index:10;"></div>



  </div>

Upvotes: 0

Views: 108

Answers (3)

Sid M
Sid M

Reputation: 4354

Its hard to understand what exactly you want to do,however if you want to add background image to div you can do it as follows

<div class="show">
some text
</div>

in CSS

.show
{
background-image:url('paper.gif');
//other css properties of div
}

ref

Upvotes: 0

Krish R
Krish R

Reputation: 22711

Can you try this,

CSS:

.Bg{
  width:300px;
  height:300px;
  background-image:url('imagepath');
 }

HTML:

 <div class='Bg'></div>

Upvotes: 0

user1635324
user1635324

Reputation: 11

Without any example code we can only guess. Maybe your div did not have any dimensions. Try adding width and height with css to your div:

<div style="width:300px;height:300px;background:url('http://webpage/path/to/image.jpg')"></div>

Upvotes: 1

Related Questions