[ОТВЕТИТЬ]
Опции темы
30.09.2015 10:33  
aldemko
Есть простой скрипт, который встраивается в страничку, подключая JS вызывает страничку.
пример
Скрытый текст (вы должны войти под своим логином или зарегистрироваться и иметь 21 сообщение(ий)):
У вас нет прав чтобы видеть скрытый текст, содержащийся здесь.


все работает отличненько и понятненько :)
форма состоит из стиля css
html разметки
и скриптов.
Стили
CSS:
Код:
<style>
#sliderBox{
    width:1000px;
    height:400px;
    background-color:#7f652b;
    position:absolute;
    top:-400px;
    left:-400px;
    z-index:300;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 0 10px #000000;
}

#background{
    position: absolute;
    z-index: 200;
    top: 0px;
    left: 0px;
    width: 100%;
    opacity: .4;
    filter: alpha(opacity=40);
    background-color: #000;
}

#closeWelcomeBox {
   background:#FFF; 
   border-radius:3px; 
   border:2px solid #000;
}

</style>


html код:

Код:
<div id="background" ></div>
<div id="sliderBox">
    <center><input type="button" id="closeWelcomeBox" value="X"/><br>
<br><br><br><br><br><br><br><br><h1><font size="7" color="black" face="Myraid Pro">Получи 30 000 рублей <br>до 1 ноября</font></h1>


    
    
    
    </center>
</div>




script:


Код:
<script type="text/javascript" src="js/slideto-1.0.js"></script>
<script language="javascript">

$(document).ready(function() {
    $('#sliderBox').slideTo({
        transition:300,

        top:'center',
        left:'center',
        inside:window
    });
    $('#background').height($(document).height());

    jQuery(window).resize(function() {
        $('#sliderBox').stop().slideTo({
            transition:300,

            top:'center',
            left:'center',
            inside:window
        });
    });

    var closeWelcomeBox;

    $(window).scroll(function(){ 
        if(!closeWelcomeBox){
            $('#sliderBox').stop().slideTo({
                transition:300,
                top:'center',
                left:'center',
                inside:window
            });
        }
    });

    
    $("#closeWelcomeBox").click(function(){
        $('#sliderBox').stop().slideTo({ 
            transition:500,
            top:-400
            });
            $('#background').fadeOut(500);
        closeWelcomeBox = true;
    });
});

</script>


и собственно сам slideto-1.0.js

JS:
Код:
/*
 * jQuery UI slideTo function
 * 
 * Copyright (c) 2011 Pieter Pareit
 *
 * http://www.scriptbreaker.com
 *
 */
(function($){
    $.fn.extend({
         slideTo: function (options) {
              var options =  $.extend({ // Default values
                   transition: 0, // millisecond, transition time
                   
                   top:'na', //pixel or 'center' position of the element
                   left:'na', //pixel or 'center' position of the element

                   bottom:'na', //pixel or 'center' position of the element
                   right:'na', //pixel or 'center' position of the element
                   
                   inside:window // element, center into window
                                      
              }, options);

              return this.each(function() {
                   var props = {position:'absolute'};
                   var top = $(this).position().top;
                   var left = $(this).position().left;

                   if(options.top != 'na'){
	                   //--- calculate top position
	                   if (options.top == 'center') {
	                        top = ($(options.inside).height() - $(this).outerHeight()) / 2;
	                   }else{
	                       top = options.top;
	                   }

	                   //calculate the offset (only when the parent is relative)
	                   if(options.inside == window || options.inside == document){
	                	   offsetTop = 0;
		                   $(this).parents().each(function(){
		                	  if($(this).css("position") == 'relative'){
		                		  offsetTop += $(this).offset().top;
		                	  }
		                   })
		                   top -= offsetTop;
		               }
	                   top += $(options.inside).scrollTop();
	                   
	                   $.extend(props, {top: top+'px'});
                   }else if(options.bottom != 'na'){
                	   top = $(options.inside).height() - $(this).outerHeight() - options.bottom;
                	   
	                   //calculate the offset (only when the parent is relative)
	                   if(options.inside == window || options.inside == document){
	                	   offsetTop = 0;
		                   $(this).parents().each(function(){
		                	  if($(this).css("position") == 'relative'){
		                		  offsetTop += $(this).offset().top;
		                	  }
		                   })
		                   top -= offsetTop;
		               }
                	   
                	   if(top < $(options.inside).scrollTop()){
                		   top += $(options.inside).scrollTop();
                	   }
                	   $.extend(props, {top: top+'px'});
                   }

                   if(options.left != 'na'){
	                   //--- calculate left position
	                   if (options.left == 'center') {
	                         left = ($(options.inside).width() - $(this).outerWidth()) / 2;
	                   }else{
							left = options.left;
	                   }

	                   //calculate the offset (only when the parent is relative)
	                   if(options.inside == window || options.inside == document){
	                	   offsetLeft = 0;
		                   $(this).parents().each(function(){
		                	  if($(this).css("position") == 'relative'){
		                		  offsetLeft += $(this).offset().left;
		                	  }
		                   })
		                   left -= offsetLeft;
		               }

	                   left += $(options.inside).scrollLeft();
	                  
	                   
	                   $.extend(props, {left: left+'px'});
                   }else if(options.right != 'na'){

	                   //calculate the offset (only when the parent is relative)
	                   if(options.inside == window || options.inside == document){
	                	   offsetLeft = 0;
		                   $(this).parents().each(function(){
		                	  if($(this).css("position") == 'relative'){
		                		  offsetLeft += $(this).offset().left;
		                	  }
		                   })
		                   left -= offsetLeft;
		               }
                	   
                	   left = $(options.inside).width() - $(this).outerWidth() - options.right;
                	   left += $(options.inside).scrollLeft();
                	   $.extend(props, {left: left+'px'});
                   }

                   //set the animation
                   if (options.transition > 0) $(this).animate(props, options.transition);
                   else $(this).css(props);
                   return $(this);
              });
         }
    });
})(jQuery);



Хотелось бы что бы, данное окошко появлялось скажем через 5 секунд после открытия сайта.
Прочитав форумы, я нашел другие скрипты с задержкой перед открытием, попытавшись оттуда вырезать и вставить часть кода отвечающего за интервал времени, результат не вышел.
Возможно не в том месте вписывал. Но в любом случае я еще заметил что у разных скриптов, разные строки кода - отвечающего за интервал ожидания перед выводом.
Подскажите как конкретно с данным кодом можно получить ожидание перед появлением окна ?
спасибо
 
30.09.2015 10:53  
OlegON
Я сразу закрываю страницу, когда такое выскакивает. Даже не разбираюсь, что там написано и как можно закрыть. Такие окна - явный признак ГС.
 
30.09.2015 11:00  
aldemko
я тоже
но все же хотелось бы через 5 сек чтоб всплывало)
к тому же там, только то что, серт до 1 ого числа можно получить
 
01.10.2015 10:42  
aldemko
Ничего не помогает почему то
пробовал и

Код:
$(document).ready(function(){
setTimeout("start();", 5000);
});
перед закрытием </script> вписывать - но не помогает
в чем ошибка подскажите
полный код:
Код:
<script language="javascript">

$(document).ready(function() {
    $('#sliderBox').slideTo({
        transition:300,

        top:'center',
        left:'center',
        inside:window

    });
    $('#background').height($(document).height());

    jQuery(window).resize(function() {
        $('#sliderBox').stop().slideTo({
            transition:300,

            top:'center',
            left:'center',
            inside:window
        });
    });

    var closeWelcomeBox;

    $(window).scroll(function(){ 
        if(!closeWelcomeBox){
            $('#sliderBox').stop().slideTo({
                transition:300,
                top:'center',
                left:'center',
                inside:window
            });
        }
    });

    
    $("#closeWelcomeBox").click(function(){
        $('#sliderBox').stop().slideTo({ 
            transition:500,
            top:-4000
            });
            $('#background').fadeOut(500);
        closeWelcomeBox = true;
    });
});
$(document).ready(function(){
setTimeout("start();", 5000);
});
</script>
 
01.10.2015 10:44  
OlegON
Я так понимаю, скрипт надо сделать асинхронным и в нем уже делать задержку.
 
05.10.2015 04:16  
aldemko
не совсем в этом разбираюсь
почитал
если сделать скрипт асинхронным это прописать asyncsrc
то к сожалению не помогло (*
 
05.10.2015 07:14  
OlegON
Что сделал... Что получилось... Или просто посочувствовать надо? Я бы рад помочь, но не в таком поганом деле.
 
 
Опции темы



Часовой пояс GMT +3, время: 23:07.

Все в прочитанное - Календарь - RSS - - Карта - Вверх 👫 Яндекс.Метрика
Форум сделан на основе vBulletin®
Copyright ©2000 - 2016, Jelsoft Enterprises Ltd. Перевод: zCarot и OlegON
В случае заимствования информации гипертекстовая индексируемая ссылка на Форум обязательна.