0

Good day i would like to know how the dark color in the image below was done . here is the link to the website just so you can see how it was done .

here

Attachments digitalpoint.jpg 79.32 KB
4
Contributors
5
Replies
7
Views
6 Years
Discussion Span
Last Post by Joenade
1

the appearance of the box is controlled by css:

#did_you_know {
-webkit-box-shadow: #999 5px 5px 10px;
background-color: black;
border-bottom-right-radius: 15px 15px;
border: 0px;
border-top-right-radius: 15px 15px;
color: #DDD;
font-size: 14px;
left: -450px;
margin: 0px;
opacity: 0.92;
padding: 25px;
position: fixed;
top: 10%;
width: 350px;
z-index: 9999;
}

The link activates a javascript to slide out:

<a style="float:right;position:relative;top:4px;" href="" OnClick="did_you_know_slide_out();return false;">Not interested</a>

the javascript is in two sections, part of the code is within the page and the rest is in an external file:

<script type="text/javascript" src="http://s.dpstatic.com/s/digitalpoint.js?v=411e"></script>


<script type="text/javascript"> 
<!--
vBulletin_init();
 
 
 
did_you_know_slide_in();
 
 
//-->
</script>

Edited by SEOCoder: n/a

0

thanks for the reply . I have some more questions
1. What part of the html tag does this go into example the head or the body tag
2. Can a video be used for this ?

0

thanks for the reply . I have some more questions
1. What part of the html tag does this go into example the head or the body tag
2. Can a video be used for this ?

The css portion is in an external file, but can be included in the header.

The HTML portion is included within the BODY tags, near the bottom because you want the page to load before the advert.

The link to the javascript file goes within the HEAD tags. The Javascript within the HTML appears just after the HTML you insert.

You can put a video in here. In the instance of the site you found they use an IMG tag within a DIV, you could do the same but use a video instead (assuming the Javascript can adequately handle the video).

0

This is easily done by jquery tool,use zoom image jquery script for this application.

0

It appears you are asking about the semi-transparent black background. This is implemented in the css:

opacity: 0.92;

If you want to know how to do the overlay popup box, then you can search for existing examples like 'LightBox' which will help you achieve the inline popup.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.