X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Всплывающее окно при клике по ссылке.
crazyicf
crazyicf
сообщение 27.1.2010, 3:44; Ответить: crazyicf
Сообщение #1


почитал все 3 страницы, вообще все шикарно, но есть пару НО. Можно ли из библиотеки jquery вырезать только то, что требуется для открытия всплывающего окна...ну задача минимизировать данный скрипт.... и чтоб при нажатии на ссылку подгружался отдельный html файл в этом окне....ну и ссылка ес-но должна задаваться.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Letmetouchyou
Letmetouchyou
сообщение 27.1.2010, 9:48; Ответить: Letmetouchyou
Сообщение #2


(crazyicf @ 27.1.2010, 05:44) *
ну задача минимизировать данный скрипт

без библиотеки его будет раз в 20 больше )
и не будет плавного появления и исчезновения)

(crazyicf @ 27.1.2010, 05:44) *
и чтоб при нажатии на ссылку подгружался отдельный html файл

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<script type="text/javascript" src="jquery.js"></script>
<style>
.popup {display:none; width:250px; height:70px; font:13px normal 'Tahoma'; color#033151; background:#ecf6ff; border:8px solid #bbe0ff; position:absolute;}
#background {display:none;
position:fixed;
height:100%;
width:100%;
top:0;
left:0;
background:#000000;
border:1px dotted #cecece;
z-index:1;}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.no').click(function(){
$('.popup').fadeOut('slow');
$('#background').fadeOut('slow');
});
$('.show').click(function(e){
$('#background').fadeIn('slow');
$('.popup').fadeIn('slow');
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $(".popup'").height();
var popupWidth = $(".popup'").width();
$(".popup'").css({
"position": "absolute",
"top": windowHeight/2-popupHeight/2,
"left": windowWidth/2-popupWidth/2
});
$('.popup').load('file.html');


$("#background").css({
"height": windowHeight
});
});
});
</script>
</head>
<body>
<a href='#' class='show'>show</a><div id="background">
<div class='popup'>
</div>
</div>
</div>
</body>
</html>


$('.popup').load('file.html');
file.html - подгружаемый файл.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Jacky
Jacky
сообщение 7.2.2010, 17:39; Ответить: Jacky
Сообщение #3


(Letmetouchyou @ 26.12.2009, 20:11) *
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type='text/css'>
.back {display:none; position:fixed; _position:absolute; height:100%; width:100%; top:0; left:0; background:#000000; border:1px solid #cecece; z-index:1;}
.pop {position:absolute; z-index:2; display:none; width:200px; height:200px; background:#6ca8e5; border:4px solid #3399ff;}
.click {width:150px; height:300px; margin:200px auto; background:#baf74e; border:5px solid #99df1e; color:#009900; font-weight:bold; font-size:25px; text-transform:uppercase; letter-spacing:-3px;}
</style>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.click').click(function(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $(".pop").height();
var popupWidth = $(".pop").width();
$(".back").css({"opacity": "0.8","height": windowHeight});
$(".back").fadeIn("slow");
$('.pop').fadeIn('slow');
$('.pop').css({
'top': windowHeight/2-popupHeight/2,
'left': windowWidth/2-popupWidth/2
});
});
});

</script>

</head>
<body>
<div class='click'>
clickable
</div>
<div class='pop'>
</div>
<div class='back'>
a
</div>
</body>
</html>
вот напрмер. кнопку азкртия окна или сам сделай , или я взатра сделаю, шас убегаю просто)


Народ, давно уже ищу что то подобное, наконец нашел. Но есть несколько ошибок он не работает в IE и когда нажимаешь он станивится не по центру экрана а по центру всей страницы, то есть если страница со Scroll то надо опускаться в самый центр.
И как сделать что бы можно было на сайте разместить несколько таких блоков?(без постоянного копирования скрипта с разным id)
Надеюсь на вашу помощь, очень надо а сам в этом не соображаю.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Letmetouchyou
Letmetouchyou
сообщение 7.2.2010, 20:21; Ответить: Letmetouchyou
Сообщение #4


10$ :)
так как ты скзал - можно моного чего сделать. по конктрентее нужно
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
skarbby
skarbby
сообщение 14.9.2011, 14:17; Ответить: skarbby
Сообщение #5


(Jacky @ 7.2.2010, 19:39) *
И как сделать что бы можно было на одной странице разместить несколько таких блоков?(без постоянного копирования скрипта с разным id)


Присоединяюсь к вопросу. Может кто подскажет? Спасибо
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
webog
webog
сообщение 16.8.2012, 21:31; Ответить: webog
Сообщение #6


Добра всем! :)

Есть вопросик. Использую данный скрипт. Все работает. Проблема вслудующем... СКРИПТ имеет струтктуру...

1. тема сообщение

2. тема2 ссобщение2

3. тема3 сообщение3 и т.д.

Слово тема представлена как ссылка и вытаскиевает из базы сообщение (структура базы: ID, тема, сообщение, от кого, дата) Т.е. все работает. Как только подключаю всплывающее окно, то в этом окне всегда показывается первоо сообщение даже если нажать на последнее!!!

Ссылка имеет вид [PHP]<a href='/vp.php#' class='show' style='color:#090;'>".$row_vp['subgect']."</a>[/PHP]

Где я пуплю?

СПАСИБО! :)


--------------------
ЙА КЛОНОВОД
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sikha
Sikha
сообщение 29.8.2012, 10:57; Ответить: Sikha
Сообщение #7


Доброго времени суток, миллион лет тут небыл )))))
Вопрос на сколько сложно реализовать всплывающую корзину как на спб пица ? нажмите на кнопку КУПИТЬ и все станет ясно!))))
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
cyber_ua
cyber_ua
сообщение 29.8.2012, 11:11; Ответить: cyber_ua
Сообщение #8


(Sikha @ 29.8.2012, 13:57) *
Доброго времени суток, миллион лет тут небыл )))))
Вопрос на сколько сложно реализовать всплывающую корзину как на спб пица ? нажмите на кнопку КУПИТЬ и все станет ясно!))))

не очень, все зависит от суммы:sarcastic:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
waw555
waw555
сообщение 6.9.2012, 19:16; Ответить: waw555
Сообщение #9


Окно появляется в левой стороне, по вертикали нормально отступает, а по горизонтали вообще не отступает, помогите исправить.

// Login Popup
jQuery(document).ready(function(){
    
    jQuery("#login_popup").overlay({
        expose: {
            color: '#000',
            loadSpeed: 200,
            opacity: 0.7
        },
        closeOnClick: true,
        api: true
    });      

    jQuery('#login_link').click(function(){
        jQuery('#login_popup').overlay().load();  
    });    
});

(function (c) {
    c.tools = c.tools || {};
    c.tools.overlay = {
        version: "1.1.2",
        addEffect: function (e, f, g) {
            b[e] = [f, g]
        },
        conf: {
            top: "10%",
            left: "center",
            absolute: false,
            speed: "normal",
            closeSpeed: "fast",
            effect: "default",
            close: null,
            oneInstance: true,
            closeOnClick: true,
            closeOnEsc: true,
            api: false,
            expose: null,
            target: null
        }
    };
    var b = {};
    c.tools.overlay.addEffect("default", function (e) {
        this.getOverlay().fadeIn(this.getConf().speed, e)
    }, function (e) {
        this.getOverlay().fadeOut(this.getConf().closeSpeed, e)
    });
    var d = [];

    function a(g, k) {
        var o = this,
            m = c(this),
            n = c(window),
            j, i, h, e = k.expose && c.tools.expose.version;
        var f = k.target || g.attr("rel");
        i = f ? c(f) : null || g;
        if (!i.length) {
            throw "Could not find Overlay: " + f
        }
        if (g && g.index(i) == -1) {
            g.click(function (p) {
                o.load(p);
                return p.preventDefault()
            })
        }
        c.each(k, function (p, q) {
            if (c.isFunction(q)) {
                m.bind(p, q)
            }
        });
        c.extend(o, {
            load: function (u) {
                if (o.isOpened()) {
                    return o
                }
                var r = b[k.effect];
                if (!r) {
                    throw 'Overlay: cannot find effect : "' + k.effect + '"'
                }
                if (k.oneInstance) {
                    c.each(d, function () {
                        this.close(u)
                    })
                }
                u = u || c.Event();
                u.type = "onBeforeLoad";
                m.trigger(u);
                if (u.isDefaultPrevented()) {
                    return o
                }
                h = true;
                if (e) {
                    i.expose().load(u)
                }
                var t = k.top;
                var s = k.left;
                var p = i.outerWidth({
                    margin: true
                });
                var q = i.outerHeight({
                    margin: true
                });
                if (typeof t == "string") {
                    t = t == "center" ? Math.max((n.height() - q) / 2, 0) : parseInt(t, 10) / 100 * n.height()
                }
                if (s == "center") {
                    s = Math.max((n.width() - p) / 2, 0)
                }
                if (!k.absolute) {
                    t += n.scrollTop();
                    s += n.scrollLeft()
                }
                i.css({
                    top: t,
                    left: s,
                    position: "absolute"
                });
                u.type = "onStart";
                m.trigger(u);
                r[0].call(o, function () {
                    if (h) {
                        u.type = "onLoad";
                        m.trigger(u)
                    }
                });
                if (k.closeOnClick) {
                    c(document).bind("click.overlay", function (w) {
                        if (!o.isOpened()) {
                            return
                        }
                        var v = c(w.target);
                        if (v.parents(i).length > 1) {
                            return
                        }
                        c.each(d, function () {
                            this.close(w)
                        })
                    })
                }
                if (k.closeOnEsc) {
                    c(document).unbind("keydown.overlay").bind("keydown.overlay", function (v) {
                        if (v.keyCode == 27) {
                            c.each(d, function () {
                                this.close(v)
                            })
                        }
                    })
                }
                return o
            },
            close: function (q) {
                if (!o.isOpened()) {
                    return o
                }
                q = q || c.Event();
                q.type = "onBeforeClose";
                m.trigger(q);
                if (q.isDefaultPrevented()) {
                    return
                }
                h = false;
                b[k.effect][1].call(o, function () {
                    q.type = "onClose";
                    m.trigger(q)
                });
                var p = true;
                c.each(d, function () {
                    if (this.isOpened()) {
                        p = false
                    }
                });
                if (p) {
                    c(document).unbind("click.overlay").unbind("keydown.overlay")
                }
                return o
            },
            getContent: function () {
                return i
            },
            getOverlay: function () {
                return i
            },
            getTrigger: function () {
                return g
            },
            getClosers: function () {
                return j
            },
            isOpened: function () {
                return h
            },
            getConf: function () {
                return k
            },
            bind: function (p, q) {
                m.bind(p, q);
                return o
            },
            unbind: function (p) {
                m.unbind(p);
                return o
            }
        });
        c.each("onBeforeLoad,onStart,onLoad,onBeforeClose,onClose".split(","), function (p, q) {
            o[q] = function (r) {
                return o.bind(q, r)
            }
        });
        if (e) {
            if (typeof k.expose == "string") {
                k.expose = {
                    color: k.expose
                }
            }
            c.extend(k.expose, {
                api: true,
                closeOnClick: k.closeOnClick,
                closeOnEsc: false
            });
            var l = i.expose(k.expose);
            l.onBeforeClose(function (p) {
                o.close(p)
            });
            o.onClose(function (p) {
                l.close(p)
            })
        }
        j = i.find(k.close || ".close");
        if (!j.length && !k.close) {
            j = c('<div class="close"></div>');
            i.prepend(j)
        }
        j.click(function (p) {
            o.close(p)
        })
    }
    c.fn.overlay = function (e) {
        var f = this.eq(typeof e == "number" ? e : 0).data("overlay");
        if (f) {
            return f
        }
        if (c.isFunction(e)) {
            e = {
                onBeforeLoad: e
            }
        }
        var g = c.extend({}, c.tools.overlay.conf);
        e = c.extend(true, g, e);
        this.each(function () {
            f = new a(c(this), e);
            d.push(f);
            c(this).data("overlay", f)
        });
        return e.api ? f : this
    }
})(jQuery);

(function (b) {
    b.tools = b.tools || {};
    b.tools.expose = {
        version: "1.0.5",
        conf: {
            maskId: null,
            loadSpeed: "slow",
            closeSpeed: "fast",
            closeOnClick: true,
            closeOnEsc: true,
            zIndex: 9998,
            opacity: 0.8,
            color: "#456",
            api: false
        }
    };

    function a() {
        if (b.browser.msie) {
            var f = b(document).height(),
                e = b(window).height();
            return [window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth, f - e < 20 ? e : f]
        }
        return [b(window).width(), b(document).height()]
    }
    function c(h, g) {
        var e = this,
            j = b(this),
            d = null,
            f = false,
            i = 0;
        b.each(g, function (k, l) {
            if (b.isFunction(l)) {
                j.bind(k, l)
            }
        });
        b(window).resize(function () {
            e.fit()
        });
        b.extend(this, {
            getMask: function () {
                return d
            },
            getExposed: function () {
                return h
            },
            getConf: function () {
                return g
            },
            isLoaded: function () {
                return f
            },
            load: function (n) {
                if (f) {
                    return e
                }
                i = h.eq(0).css("zIndex");
                if (g.maskId) {
                    d = b("#" + g.maskId)
                }
                if (!d || !d.length) {
                    var l = a();
                    d = b("<div/>").css({
                        position: "absolute",
                        top: 0,
                        left: 0,
                        width: l[0],
                        height: l[1],
                        display: "none",
                        opacity: 0,
                        zIndex: g.zIndex
                    });
                    if (g.maskId) {
                        d.attr("id", g.maskId)
                    }
                    b("body").append(d);
                    var k = d.css("backgroundColor");
                    if (!k || k == "transparent" || k == "rgba(0, 0, 0, 0)") {
                        d.css("backgroundColor", g.color)
                    }
                    if (g.closeOnEsc) {
                        b(document).bind("keydown.unexpose", function (o) {
                            if (o.keyCode == 27) {
                                e.close()
                            }
                        })
                    }
                    if (g.closeOnClick) {
                        d.bind("click.unexpose", function (o) {
                            e.close(o)
                        })
                    }
                }
                n = n || b.Event();
                n.type = "onBeforeLoad";
                j.trigger(n);
                if (n.isDefaultPrevented()) {
                    return e
                }
                b.each(h, function () {
                    var o = b(this);
                    if (!/relative|absolute|fixed/i.test(o.css("position"))) {
                        o.css("position", "relative")
                    }
                });
                h.css({
                    zIndex: Math.max(g.zIndex + 1, i == "auto" ? 0 : i)
                });
                var m = d.height();
                if (!this.isLoaded()) {
                    d.css({
                        opacity: 0,
                        display: "block"
                    }).fadeTo(g.loadSpeed, g.opacity, function () {
                        if (d.height() != m) {
                            d.css("height", m)
                        }
                        n.type = "onLoad";
                        j.trigger(n)
                    })
                }
                f = true;
                return e
            },
            close: function (k) {
                if (!f) {
                    return e
                }
                k = k || b.Event();
                k.type = "onBeforeClose";
                j.trigger(k);
                if (k.isDefaultPrevented()) {
                    return e
                }
                d.fadeOut(g.closeSpeed, function () {
                    k.type = "onClose";
                    j.trigger(k);
                    h.css({
                        zIndex: b.browser.msie ? i : null
                    })
                });
                f = false;
                return e
            },
            fit: function () {
                if (d) {
                    var k = a();
                    d.css({
                        width: k[0],
                        height: k[1]
                    })
                }
            },
            bind: function (k, l) {
                j.bind(k, l);
                return e
            },
            unbind: function (k) {
                j.unbind(k);
                return e
            }
        });
        b.each("onBeforeLoad,onLoad,onBeforeClose,onClose".split(","), function (k, l) {
            e[l] = function (m) {
                return e.bind(l, m)
            }
        })
    }
    b.fn.expose = function (d) {
        var e = this.eq(typeof d == "number" ? d : 0).data("expose");
        if (e) {
            return e
        }
        if (typeof d == "string") {
            d = {
                color: d
            }
        }
        var f = b.extend({}, b.tools.expose.conf);
        d = b.extend(f, d);
        this.each(function () {
            e = new c(b(this), d);
            b(this).data("expose", e)
        });
        return d.api ? e : this
    }
})(jQuery);
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
malzi
malzi
сообщение 2.9.2014, 18:59; Ответить: malzi
Сообщение #10


Подскажите есть форма любая но с Select например:

<form method="POST" id="orderForm" action="orders">
<input type="hidden" name="step" value="1">

<select class="w500" name="w5" id="e5">
<option value="">Выберите курс...</option>


<option value=""> - - - - - - - - - - &nbsp;&nbsp;&nbsp; 1&nbsp;&nbsp;&nbsp; - - - - - - - - - - </option>

<option value="193">2</option>
<option value="1">3</option>
<option value="200">4</option>
<option value="2">5</option>
</select>
</form>

как создать ссылку на эту форму при клике на которою в форме выбиралось бы нужное поле например 3 ?

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на первый заказ.
Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на п
6 stu999 1551 21.3.2024, 20:45
автор: stu999
Открытая тема (нет новых ответов) Получил странную ссылку при линкбилдинге
Как поведет себя поиск при обнаружении странной ссылке?
10 r0mZet 2178 24.10.2022, 19:23
автор: Wachowski
Горячая тема (нет новых ответов) 300 площадок под вечные ссылки на выбор: ТИЦ 20-9400, PR 0-6, ЯК, DMOZ. Скидки при пакетном заказе!
65 inkon 30255 19.7.2022, 13:41
автор: Funoman
Горячая тема (нет новых ответов) тИЦ отменили! Новый показатель Яндекса ИКС! Лучшие площадки под размещение. Бесплатное написание статей при любом заказе.
Эксклюзивное предложение. Успей получить написание статей БЕСПЛАТНО
71 VIMstat 78308 21.6.2022, 9:38
автор: VIMstat
Открытая тема (нет новых ответов) Ukr Private Proxy 4g Lifecell, Kyivstar, Vodafone (ТЕСТ, смена по ссылке, ротация)
Продам Личные Украинские приватные мобильные прокси 4g Lifecell, Kyivs
1 Kostyaxxxx 4244 20.6.2021, 20:26
автор: Kostyaxxxx


 



RSS Текстовая версия Сейчас: 28.3.2024, 17:55
Дизайн