WordPress.org
Get WordPress

Plugin Directory

Changeset 1680078


Ignore:
Timestamp:
06/16/2017 06:41:00 PM (9 years ago)
Author:
gchoyal1
Message:

responsive popup

Location:
choyal-subscription-popup/tags/2.0/assets
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • choyal-subscription-popup/tags/2.0/assets/css/style.css

    r1679682 r1680078  
    1212    padding: 25px;
    1313    width: 550px;
    14     position: fixed;
     14    margin: auto;
     15    position: relative;
    1516    box-shadow: 0 0 5px #3e3c3c;
    16     margin: 10% 30%;
     17    top:25%;
    1718    border-radius: 5px;
    18     bottom: -400px;
    1919    z-index: 9999;
    2020}
    … …  
    200200    font-size: 16px;
    201201}
     202.csp_overlay{
     203    height:3200px;
     204}
     205@media (max-width: 800px) {
     206    .csp_model{
     207        width: 90%;
     208    }
     209}
     210
     211
     212/********************************/
     213
     214@media (min-height: 250px) {
     215    .csp_overlay{
     216        height: 250px;
     217    }
     218}
     219
     220@media (min-height: 300px) {
     221    .csp_overlay{
     222        height: 300px;
     223    }
     224}
     225
     226@media (min-height: 320px) {
     227    .csp_overlay{
     228        height: 320px;
     229    }
     230    .csp_model{
     231        top: 5%;
     232        padding: 15px;
     233    }
     234    .csp-popup-heading {
     235        font-size: 25px;
     236    }
     237    .csp-popup-para {
     238        font-size: 16px;
     239    }
     240    .csp_row label {
     241        font-size: 12px;
     242    }
     243}
     244
     245@media (min-height: 360px) {
     246    .csp_overlay{
     247        height: 360px;
     248    }
     249    .csp_model{
     250        top: 9%;
     251        padding: 15px;
     252    }
     253   
     254    .csp-popup-heading {
     255        font-size: 25px;
     256    }
     257    .csp-popup-para {
     258        font-size: 16px;
     259    }
     260    .csp_row label {
     261        font-size: 12px;
     262    }
     263   
     264}
     265
     266@media (min-height: 375px) {
     267    .csp_overlay{
     268        height: 375px;
     269    }
     270    .csp_model{
     271        top: 14%;
     272        padding: 15px;
     273    }
     274}
     275
     276@media (min-height: 400px) {
     277    .csp_overlay{
     278        height: 400px;
     279    }
     280    .csp_model{
     281        top: 8%;
     282        padding: 15px;
     283    }
     284}
     285
     286@media (min-height: 412px) {
     287    .csp_overlay{
     288        height: 412px;
     289    }
     290    .csp_model{
     291        top: 17%;
     292        padding: 15px;
     293    }
     294}
     295
     296@media (min-height: 414px) {
     297    .csp_overlay{
     298        height: 414px;
     299    }
     300    .csp_model{
     301        top: 18%;
     302        padding: 15px;
     303    }
     304}
     305
     306@media (min-height: 500px) {
     307    .csp_overlay{
     308        height: 500px;
     309    }
     310    .csp-popup-heading {
     311        font-size: 25px;
     312    }
     313    .csp-popup-para {
     314        font-size: 16px;
     315    }
     316    .csp_row label {
     317        font-size: 12px;
     318    }
     319}
     320
     321@media (min-height: 550px) {
     322    .csp_overlay{
     323        height: 550px;
     324    }
     325}
     326
     327@media (min-height: 568px) {
     328    .csp_overlay{
     329        height: 568px;
     330    }
     331    .csp_model{
     332        top: 20%;
     333    }
     334}
     335
     336@media (min-height: 640px) {
     337    .csp_overlay{
     338        height: 640px;
     339    }
     340    .csp_model{
     341        top: 27%;
     342    }
     343}
     344
     345@media (min-height: 667px) {
     346    .csp_overlay{
     347        height: 667px;
     348    }
     349    .csp_model{
     350        top: 30%;
     351    }
     352}
     353
     354@media (min-height: 670px) {
     355    .csp_overlay{
     356        height: 670px;
     357    }
     358}
     359
     360@media (min-height: 732px) {
     361    .csp_overlay{
     362        height: 732px;
     363    }
     364    .csp_model{
     365        top: 28%;
     366    }
     367}
     368
     369@media (min-height: 736px) {
     370    .csp_overlay{
     371        height: 736px;
     372    }
     373    .csp_model{
     374        top: 28%;
     375    }
     376}
     377
     378@media (min-height: 750px) {
     379    .csp_overlay{
     380        height: 750px;
     381    }
     382}
     383
     384@media (min-height: 768px) {
     385    .csp_overlay{
     386        height: 768px;
     387    }
     388    .csp_model{
     389        top: 30%;
     390    }
     391}
     392
     393@media (min-height: 900px) {
     394    .csp_overlay{
     395        height: 900px;
     396    }
     397}
     398
     399@media (min-height: 1000px) {
     400    .csp_overlay{
     401        height: 1000px;
     402    }
     403}
     404
     405
     406@media (min-height: 1024px) {
     407    .csp_overlay{
     408        height: 1024px;
     409    }
     410    .csp_model{
     411        top: 34%;
     412    }
     413}
     414
     415@media (min-height: 1200px) {
     416    .csp_overlay{
     417        height: 1200px;
     418    }
     419}
     420
     421@media (min-height: 1366px) {
     422    .csp_overlay{
     423        height: 1366px;
     424    }
     425    .csp_model{
     426        top: 34%;
     427    }
     428}
     429
     430@media (min-height: 1400px) {
     431    .csp_overlay{
     432        height: 1400px;
     433    }
     434}
     435
     436@media (min-height: 1600px) {
     437    .csp_overlay{
     438        height: 1600px;
     439    }
     440}
     441
     442@media (min-height: 2000px) {
     443    .csp_overlay{
     444        height: 2000px;
     445    }
     446}
     447
     448@media (min-height: 2500px) {
     449    .csp_overlay{
     450        height: 2500px;
     451    }
     452}
     453
     454@media (min-height: 4000px) {
     455    .csp_overlay{
     456        height: 4000px;
     457    }
     458}

  • choyal-subscription-popup/tags/2.0/assets/js/script.js

    r1675416 r1680078  
    11jQuery(document).ready(function(){
    2    
    3     jQuery('.csp_model').animate({'bottom': '0px'}, 300);
    42   
    53    jQuery('.csp_close').click(function(){
    64       
    7         jQuery('.csp_model').animate({'bottom': '-400px'}, 300);
    85        jQuery('.csp_overlay').hide();
    96        jQuery('.csp_subscribe_btn').show();
    … …  
    1411    jQuery('.csp_subscribe_btn').click(function(){
    1512       
    16         jQuery('.csp_model').animate({'bottom': '0px'}, 300);
    1713        jQuery('.csp_overlay').show();
    1814        jQuery('.csp_subscribe_btn').hide();
Note: See TracChangeset for help on using the changeset viewer.