Два скрола с едновременно движение.

P

proba

Registered
Здравейте.
Преди време 1 приятел ми беше дал един скрип чрез който като скролвам единя да се скролва и другия. И двата ги слагам на textarea но под опера има проблем. Още от преди работеше под ie но под opera не (а под други незнам).
Ето кода:

[js]
function scroll(n_textarea)
{
if (n_textarea == 1)
{
document.getElementById('line').scrollTop = document.getElementById('text').scrollTop;
}
else
{
document.getElementById('text').scrollTop = document.getElementById('line').scrollTop;
}
}
[/js]

Ето и html кода:

HTML: 
<table class="openfile">
<tr>
<td class="line">
<textarea id="line" onScroll="scroll(2)" class="line" readonly>
test 123
test2
2da
r3q
fq
fq
fq
fq
</textarea>
</td>
<td class="openfile">
<textarea input type="text" name="content" class="openfile" id="text" onScroll="scroll(1)">text test</textarea>
</td>
</tr>
</table>

Някаква идея откъде идва проблема и как да бъде отстранен ?[/html]
 
Проблемът идва от факта че Опера не поддържа onscroll. Ето малко дървено, но работещо решение:

[js]
function scroll(n_textarea) {
if (navigator.appName=='Opera')
window.setTimeout(function(){doScroll(n_textarea);},100);
else
doScroll(n_teaxtarea);
}

function doScroll(n_textarea) {
if (n_textarea == 1)
document.getElementById('line').scrollTop = document.getElementById('text').scrollTop;
else
document.getElementById('text').scrollTop = document.getElementById('line').scrollTop;
}
[/js]

HTML: 
<textarea name="line" id="line" onscroll="scroll(2)"  onmousedown="scroll(2)">
.
.
.
<textarea name="text" id="text" onscroll="scroll(1)" onmousedown="scroll(1)">

[/js]
 
Нещо не иска да работи.
С поелдна версия на opera съм..
To всъщност и под chrome не работи , а под други браузъри незнам..
 
Я виж дали това работи http://www.startinvoice.com/test.html и ако те урежда си вземи кода от View Source:


Видях че съм сбъркал тук:
doScroll(n_teaxtarea);

името на променливата съм объркал:
doScroll(n_textarea);
 
Мисля, че нещо такова ще свърши работа. Ползвал съм методът със setInterval, който се чисти при keyup и mouseup. Има поддръжка на mouse wheel. Също така проверката за браузър се прави само веднъж, а не при всяко възникване на събитие.

Мислех си за някакви mutation events, но се оказва, че textarea тагът под Opera е напълно осакатен откъм евенти въпреки добрата поддръжка на браузъра на HTML5 набора от събития.

HTML: 
<html>
    <head>
        <title></title>
        <script type="text/javascript">
            var attachEvent, detachEvent;

            if( typeof window.addEventListener === 'function' ) {
                attachEvent = function ( o, e, f ) { o.addEventListener( e, f, false ); };
                detachEvent    = function ( o, e, f ) { o.removeEventListener( e, f, false ); };
            }
            else if( typeof document.attachEvent === 'function' ) {
                attachEvent    = function ( o, e, f ) { o.attachEvent( 'on' + e, f ); };
                detachEvent    = function ( o, e, f ) { o.detachEvent( 'on' + e, f ); };
            }
            else {
                attachEvent    = function ( o, e, f ) { o['on' + e] = f; };
                detachEvent    = function ( o, e, f ) { o['on' + e] = null; };
            }

            var bindScrolls    = function () {
                var
                    interval,

                    onscroll    = function ( o1, o2 ) {
                        return function () {
                            o2.scrollLeft    = o1.scrollLeft;
                            o2.scrollTop    = o1.scrollTop;
                        }
                    },

                    stop        = function () {
                        window.clearInterval( interval );
                    };

                if( typeof window.opera == 'undefined' ) {
                    return function ( t1, t2 ) {
                        attachEvent( t1, 'scroll', onscroll( t1, t2 ) );
                    };
                }

                attachEvent( document, 'mouseup', stop );
                attachEvent( document, 'keyup', stop );

                return function ( t1, t2 ) {
                    var
                        listen    = function () {
                            stop();
                            interval    = window.setInterval( onscroll( t1, t2 ), 50 );
                        },

                        mousewheel    = function ( e ) {
                            t1.scrollTop    -= 3 * ( e.wheelDelta / 10 );
                            onscroll( t1, t2 )();
                            e.preventDefault();
                        };

                    attachEvent( t1, 'mousewheel', mousewheel );
                    attachEvent( t1, 'mousedown', listen );
                    attachEvent( t1, 'keydown', listen );
                };
            }();
        </script>
    </head>

    <body>
        <form action="?">
            <textarea name="line" id="line" class="ta" style="height: 100px;"></textarea>
            <textarea name="text" id="text" class="ta" style="height: 100px;"></textarea>
        </form>
        <script type="text/javascript">
            /*<![CDATA[*/
                var
                    t1    = document.getElementById( 'line' ),
                    t2    = document.getElementById( 'text' );

                bindScrolls( t1, t2 ); // Връзване на line към text
                bindScrolls( t2, t1 ); // Връзване на text към line
            //]]>
        </script>
    </body>
</html>
 
@palex на демото не работи под Opera , а под друг браузър не съм гледал.
@sandh твоя работи под Opera и Chrome (под друг не съм гледал) и съответно получаваш +1.
И отново много благодаря за помоща! ;)
 
Аз тук съм тествал на Firefox, IE 7. Би трябвало да работи по нормалния начин на всички браузъри различни от Опера. Ползвал съм browser sniffing като проверявам window.opera (което не е особено добра практика - особено ако следващата Опера е наред с евентите), но не виждам как иначе да засечем проблема.
 
Това значи ли че би могъл да се появи проблем под нова версия на Opera ?
И ако оправят тезо "event"-и , коя част от кода ще трябва да премахна за да стане като при другите браузъри ?
Давам ти +1 (че бях забравил) и няма да мога да пиша в темата , затова може и на ЛС да ми отговориш. Благодаря ;)
 
Не, няма да има проблеми с по-новите версии, но няма как да се установи дали бъга е оправен и скриптът ще продължи да хардкодва браузъра.

Иначе, когато Opera си оправят бакиите, можеш да ползваш твоя код.
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе