» » Create bottom right corner of suspended ad by jQuery

 

Create bottom right corner of suspended ad by jQuery

Author: bamboo06 on 4-11-2014, 04:55, views: 3171

6
Lower right corner of the suspension advertising is a common web advertising presentation, but also interfere with the user's browser is suspected but the site is very popular with webmasters earnings welcome. Today I have to share a web page using jQuery to achieve the lower right corner advertising instance. Its advantage is slowly rising from the bottom right corner, showing a certain time automatically disappear, and you can change the website message prompt window.

HTML
First prepare creative and create ads main DIV # pop a user suspended in the body, is set to not show the title bar in the upper ads have close button is clicked off, then turn off the hidden suspended advertising.

<div id="pop" style="display:none;"> 
      <div id="popHead"> 
        <a id="popClose" title="Close">Close</a> 
        <h2>Sponsor ads</h2> 
    </div> 
    <div id="popContent"> 
    <a href="http://www.goocode.net/" target="_blank"><img src="imgad.jpg"></a> 
    </div> 
</div> 

CSS
Using CSS a little landscaping #pop. Note In fact, we use position: fixed; right: 0; bottom: 0; in fact, it has been fixed at the lower right corner of the ad position, but to take into account those users of IE6, ie6 does not support fixed, the problem that we can come through jquery plugins ie6 compatible line problem solving.

#pop{background:#fff;width:300px; height:282px;font-size:12px;position:fixed;right:0;bottom:0;} 
#popHead{line-height:32px;background:#f6f0f3;border-bottom:1px solid #e0e0e0;font-size:12px; 
padding-left:10px;} 
#popHead h2{font-size:14px;color:#666;line-height:32px;height:32px;} 
#popHead #popClose{position:absolute;right:10px;top:1px;} 
#popHead a#popClose:hover{color:#f00;cursor:pointer;} 

jQuery
The suspension advertising effectiveness depends on jQuery, so when the page loads do not forget to load the jQuery library file.

function Pop(){ 
    this.apearTime=1000; 
    this.hideTime=500; 
    this.delay=10000; 
    //Show 
    this.showDiv(); 
    //close
    this.closeDiv(); 
} 
Pop.prototype={ 
  showDiv:function(time){ 
    if (!($.browser.msie && ($.browser.version == "6.0") && !$.support.style)) { 
      $('#pop').slideDown(this.apearTime).delay(this.delay).fadeOut(400);; 
    } else{//call jquery.fixed.js, solving ie6 not supporting fixed 
      $('#pop').show(); 
            jQuery(function($j){ 
                $j('#pop').positionFixed() 
            }) 
    } 
  }, 
  closeDiv:function(){ 
      $("#popClose").click(function(){ 
            $('#pop').hide(); 
          } 
    ); 
  } 
} 

In the case of ie6, we call jquery.fixed this plug-in, of course, we have put the plug-in on the bag ads.js download, download the compressed package. The effect of calling this code only needs to write:
var popad=new Pop(); 

In this way, we can show a lower right corner of the suspension advertising effectiveness, we can continue to expand, (), some of the parameters passed to Pop, can be extended to the website message box and other effects, this left to students who are interested.

Category: Javascript / Plugins

Dear visitor, you are browsing our website as Guest.
We strongly recommend you to register and login to view hidden contents.
<
  • 0 Comments
  • 0 Articles
17 January 2017 00:07

Jani

Reply
  • Group: Guests
  • РRegistered date: --
  • Status:
 
nice post. very nice but download link is not appeared

<
  • 0 Comments
  • 0 Articles
19 June 2017 06:35

Nicholas Reynolds

Reply
  • Group: Guests
  • РRegistered date: --
  • Status:
 
Creating advertisement are what I would've thought being much difficult earlier before. But this thesis service has been creating some amazing adverts so I wanted to learn as well. Thanks for providing me with this opportunity here.

<
  • 0 Comments
  • 0 Articles
12 July 2017 05:33

joseph thomson

Reply
  • Group: Guests
  • РRegistered date: --
  • Status:
 
Wow great, I have been looking for a way to get started with all of suspended ad by jQuery, The granite countertops in denver has helped me to get till here and see some incredible and impressive stuff for me, Thanks again for the share

<
  • 0 Comments
  • 0 Articles
4 January 2018 02:50

Marry John

Reply
  • Group: Guests
  • РRegistered date: --
  • Status:
 
<a href="www.web.com">visit</a> thanks

<
  • 0 Comments
  • 0 Articles
11 February 2018 23:50

Jacuninny

Reply
  • Group: Guests
  • РRegistered date: --
  • Status:
 
Clomid Menstruations cialis online Pet Cephalexin 500mg Cap Viagra Gel Online

Information
Comment on the news site is possible only within (days) days from the date of publication.