Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Works in all but Safari, any suggestions? (Even works on IE on Mac...)

    The following code reportedly works on IE/Mac, but not on Safari. The "scroller", fired by setInterval() has some basic code to make it accelerate, and supposedly accelerates wildly and *intermittently* doesn't stop on Safari. Question one, can any Safari users confirm this? Can you discern a pattern?

    I've searched and searched on Safari and setInterval, as I believe that is the root of the problem, and I found references to needing to have the function call in set interval written within quotes, or without parenthesis. As you can see I added browser detection and handled accordingly but the problem persists. I thought that perhaps Safari was repeatedly sending the onmousedown call repeatedly, so I added a flag to indicate if the left_down() and right_down() functions had already fired and trapped subsequent calls. No dice.

    I'm really scratching my head here, because I'm getting report of intermittent problems (sometimes it supposedly works), I thought that perhaps I had an error in my code and wasn't clearing each interval that was set. Doesn't look that way to me, but if you see something I'm missing, please let me know.

    So basically, any light anyone can shed on this is greatly appreciated. Feel free to use the code any way you'd like. Once it works without problems of course

    See it in action at www.etchlight.com. Thanks in advance.

    PS - First-time poster, long time reader...

    Thank you.
    George

    Code:
        <script type="text/javascript">
    
        /* snip browser detection code */
    
        BrowserDetect.init();
        //Browser name: BrowserDetect.browser
        //Browser version: BrowserDetect.version
        //OS name: BrowserDetect.OS
    
        //alert('BrowserDetect.browser' + BrowserDetect.OS);
        
        //var dir_scroll_btn_images = '{http_server}/images/';
        var dir_scroll_btn_images = 'images/';
        var btn_scroll_left_off = new Image(25, 128);
        btn_scroll_left_off.src = dir_scroll_btn_images + 'scroll_left_off.gif';
        var btn_scroll_left_on = new Image(25, 128);
        btn_scroll_left_on.src = dir_scroll_btn_images + 'scroll_left_on.gif';
        var btn_scroll_right_off = new Image(25, 128);
        btn_scroll_right_off.src = dir_scroll_btn_images + 'scroll_right_off.gif';
        var btn_scroll_right_on = new Image(25, 128);
        btn_scroll_right_on.src = dir_scroll_btn_images + 'scroll_right_on.gif';
        var interval = 0;
        var div_width = null;
        var clipper_width = null;
        var m = 0;
        var n = 0;
        var init = 0;
        var speed = 8;
        var left_down = 0;
        var right_down = 0;
        
        speed_reset();
        
        function speed_reset() {
            speed = 1;
        }
        function scroller_init() {
            div_width = document.getElementById('scrollcontent').scrollWidth;
        }
        function accelerate_speed() {
            if (speed < 12) {
                speed = (speed * 1.02);
            }
        }    
        function scroller_move_left() {
            if (init == 0) { 
                init=1; scroller_init(); 
            }
            accelerate_speed();
            m -= speed;
            n -= speed;
            if (m <= (-1 * div_width)) {      
                m = 0;        
            }
            if (n <= (-1 * div_width)) {
                n = 0;
            }
            document.getElementById('scrollcontent').style.left = m + 'px';
            document.getElementById('scrollcontent2').style.left = n + 'px';
        }
        function scroller_move_right() {
            if (init == 0) { 
                init=1; scroller_init(); 
            }
            accelerate_speed();
            m += speed;
            n += speed;
            if (m >= 0) {    
                m = (-1 * div_width);
            }
            if (n >= 0) {     
                n = (-1 * div_width);
            }
            document.getElementById('scrollcontent').style.left = m + 'px';
            document.getElementById('scrollcontent2').style.left = n + 'px';
        }
        
        function scroll_left_over() {
            this_img = document.getElementById('scrollleft').src = btn_scroll_left_on.src;
        }
        function scroll_left_out() {
            this_img = document.getElementById('scrollleft').src = btn_scroll_left_off.src;
        }
        function scroll_left_down() {
            if (left_down == 1) { return; } else { left_down = 1; }
            clearInterval(interval);
            scroll_left_over();     
            speed_reset();
            if (BrowserDetect.OS == 'Mac' && BrowserDetect.browser == 'Safari') {
                interval = setInterval(scroller_move_left, 10);
            } else {
                interval = setInterval('scroller_move_left()', 10);
            }
      //      interval = setInterval('scroller_move_left()', 10);
        }
        function scroll_left_up() {
            left_down = 0;
            scroller_stop();
            scroll_left_out();
        }
        function scroll_right_over() {
            right_img = document.getElementById('scrollright').src = btn_scroll_right_on.src;
        }
        function scroll_right_out() {
            left_img = document.getElementById('scrollright').src = btn_scroll_right_off.src;
        }
        function scroll_right_down() {
            if (right_down == 1) { return; } else { right_down = 1; }
            clearInterval(interval);
            scroll_right_over();        
            speed_reset();
            if (BrowserDetect.OS == 'Mac' && BrowserDetect.browser == 'Safari') {
                interval = setInterval(scroller_move_right, 10);
            } else {
                interval = setInterval('scroller_move_right()', 10);
            }
    //        interval = setInterval('scroller_move_right()', 10);
        }
        function scroll_right_up() {
            right_down = 0;
            scroller_stop();
            scroll_right_out();
        }
        function scroller_stop() {
            clearInterval(interval);
            speed_reset();
        }
            
        </script>

  • #2
    Regular Coder
    Join Date
    Nov 2005
    Posts
    329
    Thanks
    3
    Thanked 19 Times in 19 Posts
    Safari: When onClicking and holding down the img arrows on either side of the frame, it scrolls left to right and right to left but the page properties window pops up at the same time


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •