Popup na vyhledavani

Popup na vyhledavani

~ Anonymní uživatel
~ 1 příspěvek

7. 11. 2011 #1

ahoj, nevite nekdo jak udelat vyskakovaci okno, ktere vyskoci po kliku napr na vyhledavaci policko? napr jako je to zde http://www.backlinkwatch.com Diky

Nahlásit jako SPAM

IP: 92.240.191.–

tonez+1

Návštěvník

8. 11. 2011 #2

#1 ondrasimuss
no jelikoz je to kus JS + CSS tak to muzes zkopirovat ze zdrojaku dane stranky ;)

no a nebo muzes pouzit ruzne alternativy např. http://fancybox.net/ (plugin pro jQuery), který je prave delany na takovahle pseudo popup okynka :)

Nahlásit jako SPAM

IP: 188.120.217.–

Im web developer. (x)HTML, CSS, JavaScript + jQuery, PHP, MySQL and others :))

asdasd

~ Anonymní uživatel
~ 30 příspěvků

11. 11. 2011 #3

Kopírovat zdrojáky je sprostý a používat na tak jednoduchou věc komplexní plugin jako fancybox je zase neefektivní.

<!doctype html>
<html>
    <head>
        <title>
            Opruz
        </title>
        <meta charset="utf-8">
        <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
        <script>
            otravuj = function(url, obsah) {
                $('body').app end([
                    '<div class="otravuj">',
                    '    <div>',
                    '        <a href="' + url + '">',
                    obsah,
                    '        </a>',
                    '    </div>',
                    '</div>'
                ].join('\n'));
                var $otravuj = $('.otravuj');
                $otravuj
                    .fadeIn(250)
                    .find('> div')
                    .css('top', ($(window).height() - $('> div', $otravuj).outerHeight()) / 2)
                    .find('> a')
                    .one('click', function() {
                        $otravuj.fadeOut(250);
                    });
                    
            };            
            
            $(function() {
                $('input').one('click', function() {
                    otravuj('#', 'Vyhrál jsi milión!!!<br />Klepni sem!!!');
                });
            });
        </script>
        <style>
            .otravuj {
                display: none;
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.5);
            }
            
            .otravuj > div {
                position: relative;
                   margin: 0 auto;
                   width: 400px;
                padding: 20px;
                background: #ffffff;
                -moz-box-shadow: 5px 5px 5px #555555;
                -webkit-box-shadow: 5px 5px 5px #555555;
                -o-box-shadow: 5px 5px 5px #555555;
                box-shadow: 5px 5px 5px #555555;
            }
            
            .otravuj > div > a {
                display: block;
                padding: 10px;
                text-align: center;
                text-transform: uppercase;
                line-height: 35px;
                font-size: 20px;
                font-weight: bold;
                color: #ffffff;
                background: #000000;
            }
        </style>
    </head>
    <body>
        <input type="text" />
    </body>
</html>

Nahlásit jako SPAM

IP: 83.240.95.–