Почему скрипт прокрутки блокирует другие js?

Question

[viktorross]

здравствуйте, подскажите пожалуйста, у меня есть скрипт сайдбара, прокручивает рекламу или другой какой-то блок сбоку, автоматически определяет высоту верха и низа, скрипт отличный и в большинстве случаев никаких проблем нет, однако заметил что внутри <aside id="aside1"></aside>

не работают другие скрипты, точнее работают до первой прокрутки, только начинаешь двигать страницу вниз и все, при этом в консоле нет ошибок вообще, кто понимает в этом подскажите пожалуйста проблему, очень нужно чтобы это работало

вот скрипт

<script>
(function(){
var a = document.querySelector('#aside1'), b = null, P = 0;
window.addEventListener('scroll', Ascroll, false);
document.body.addEventListener('scroll', Ascroll, false);
function Ascroll() {
if (b == null) {
var Sa = getComputedStyle(a, ''), s = '';
for (var i = 0; i < Sa.length; i++) {
	if (Sa[i].indexOf('width') == 0) {
		s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; '
	}
}
a.innerHTML = '<div style="'+s+'">'+a.innerHTML+'</div>';
b = a.children[0];
a.style.height = b.getBoundingClientRect().height + 'px';
a.style.padding = '0';
a.style.border = '0';
}
var Ra = a.getBoundingClientRect(),
	R = Math.round(Ra.top + b.getBoundingClientRect().height - document.querySelector('#footer').getBoundingClientRect().top + 0);
if ((Ra.top - P) <= 0) {
if ((Ra.top - P) <= R) {
	b.className = 'stop';
	b.style.top = - R +'px';
} else {
	b.className = 'sticky';
	b.style.top = P + 'px';
}
} else {
b.className = 'dddskfnjs';
b.style.top = '';
}
}
})()
</script>

html

<aside id="aside1">
и например кнопка со скриптом

<a href="javascript:;" id="show_{$phone.caption}">


</aside>
<script>
$("a.show_phone").click(function(event){

	var field = jQuery(this).attr("id").substr(5);

	$.ajax({
		type		: "GET",
		cache		: false,
		url		: "{/literal}{$live_site}/include/get_phone.php?aid={$listing.id}&{if $listing.user_id}id={$listing.user_id}{/if}&field={literal}"+field,
		data		: $(this).serializeArray(),
		success: function(data) {

				$("#span_"+field).html(data);
				$("#show_low_Kd").hide();
				$("#show_low_Kd_whatsapp").hide();
				//$("#show_"+field).show();

			} // end data
		});// end ajax

});
</script>

css

.sticky {position: fixed;z-index: 101;top:60px!important;}
.stop {position: relative;z-index: 101;}

опять же ладно эта кнопка, но допустим половина медийной рекламы яндекса блокируется, некоторые мой блоки с js тоже

Answer 1

[AUser0]

Такое ощущение, что всё портит строчка

a.innerHTML = '<div style="'+s+'">'+a.innerHTML+'</div>';

Comments

[viktorross]

AUser0, Вы случайно не знаете чем это заменить можно, чтобы все работало? я уже покрутил эту строчку, но тогда скрипт перестает работать, просто содержимое на месте стоит и не двигается никуда, а нужно чтобы сбоку плавало

[AUser0]

Сделайте самое простое: a.style = s;
А если не хотите менять стиль тега <aside> - тогда изначально создайте <div id=aside1_div>, и ему меняйте document.querySelector('#aside1_div').style = s.

[viktorross]

AUser0, спасибо  Вам огромное, поставил вот это a.style = s; , работает наконец-таки, единственное, почему-то изменяется автоматически после начала прокрутки ширина блока, т.е прокрутка начинается и блок сужается до например 372.83px не понятно откуда он берет это, когда на сам блок выделено 30% в css, можно ли запретить автоматическое изменение ширины как-то? Когда доходит до самого низа или верха обратно, то ширина восстанавливается

[AUser0]

Так у вас же тег <aside>, а он именно для этого и создан, находиться сбоку от основного текста.
Меняйте тег.

[viktorross]

AUser0, поменял на div, все равно почему-то сужается когда добавляется sticky, я добавил к div id = aside2 класс с четкой шириной 308px!important , без important не работает, и теперь и при прокрутке и так ширина фиксированная, но если убрать он подставляет своё значение, а берет он его кажется отсюда, но даже если убрать, все равно сжимается до не понятно откуда взятой ширины, в console нигде не вижу

for (var i = 0; i < Sa.length; i++) {
  	if (Sa[i].indexOf('width') === 0) {
  		s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; ';
  	}