Я пытаюсь создать плагин jQuery для мобильного сайта, который превращает контейнер div в прокручиваемый контейнер.Я выполняю это, помещая все дочерние элементы, которые находятся внутри контейнера div, в другой контейнер div, который абсолютно расположен.Затем я изменяю верхний или левый стили CSS внутреннего div для имитации перемещения текста вверх и вниз или влево и вправо.Я использую приемники событий касания, чтобы определить, когда перемещать прокручиваемый div.
Однако у меня возникают некоторые проблемы с настройкой width () моего внутреннего прокручиваемого div.Вот пример кода:
myObj.ready(function(){
myObj.css({ 'position' : 'relative', 'overflow' : 'hidden' }).wrapInner('<div id="scrollCntr">');
$('#scrollCntr').prepend("<img src='scrollBar.png' id='scrollBar' class='horizontal'");
$('#scrollCntr').height( myObj.height() );
if ( config.width <= 0 ) {
$('#scrollCntr').children().each(function(){
if ( $(this).css('display') == 'inline' || $(this).css('float') == 'left' || $(this).css('float') == 'right' ) {
totalWidth += $(this).width();
for( var i = 0; i < boxProps.length; i++ )
if ( $(this).css(boxProps[i]) != "" )
totalWidth += parseInt( $(this).css(boxProps[i]).replace( /px/i, '' ).replace( /em/i, '' ).replace( /pt/i, '' ) );
}
});
} else {
totalWidth = config.width;
}
console.log( totalWidth );
$('#scrollCntr').width( totalWidth );
console.log( $('#scrollCntr').width() );
});
В этом случае config.width имеет значение 719, а myObj - прокручиваемый элемент контейнера.Я не совсем уверен, в чем проблема.У меня не было никаких проблем с этим в моей демонстрации, когда мои дочерние элементы были просто изображениями, но когда я применил его к своему мобильному веб-сайту, где у дочерних элементов были элементы div, у него были проблемы.Возможно, дочерние элементы не загружаются вовремя?Но это не объясняет, почему я не могу установить ширину прокрутки div.Это определенно загружается.Понятия не имею, в чем проблема ...