Ruby on Rails | Screencasts | Download | Documentation | Weblog | Community | Source

Ticket #7663 (new defect)

Opened 1 year ago

Last modified 1 year ago

Slider problems in Safari

Reported by: almsy Assigned to: madrobby
Priority: high Milestone:
Component: script.aculo.us Version:
Severity: major Keywords: slider
Cc:

Description (Last modified by bitsweat)

When a slider is placed in a div with the initial display property set to none, the slider becomes inactive when the div becomes visible.

A test case can be found here: http://pastie.caboo.se/42529

This codes seems to work on FF and IE but is failing in Safari.

Mike

Here is the HTML for the test case. To test, you may have to change the include directories for the javascript files.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Slider Test Case</title>
<script language="JavaScript" type="text/javascript" src="js/prototype.js"></script>
<script language="JavaScript" type="text/javascript" src="js/slider.js"></script>
</head>
<body>
<div id="test" style="display:none;">
    <div id="track" style="width:200px;background-color:#aaa;height:5px;">
        <div id="handle" style="width:5px;height:10px;background-color:#f00;cursor:move;"> </div>
    </div>
</div>

<div>
    <div id="track1" style="width:200px;background-color:#aaa;height:5px;">
        <div id="handle1" style="width:5px;height:10px;background-color:#f00;cursor:move;"> </div>
    </div>
</div>

<a href="#" onclick="$('test').toggle(); return false;">toggle</a> <span id="drag1"></span>
<script type="text/javascript" language="javascript">
        var slider = new Control.Slider('handle','track',
                {
                        range:$R(1,8),
                        values:[1,2,3,4,5,6,7,8],
                        disabled: false,
                        onSlide: changeImages, onChange: changeImages
                        
                });
        var slider1 = new Control.Slider('handle1','track1',
                {
                        range:$R(1,8),
                        values:[1,2,3,4,5,6,7,8],
                        disabled: false,
                        onSlide: changeImages, onChange: changeImages
                });
        function changeImages(v) 
        {
                $('drag1').innerHTML = v;
        }
</script>
</body>
</html>

Change History

03/05/07 21:30:03 changed by almsy

  • severity changed from normal to major.

03/05/07 21:31:16 changed by almsy

Changed the severity to major because it's slowing down the progress of a current project I'm working on.

(follow-up: ↓ 4 ) 03/05/07 23:30:45 changed by bitsweat

  • keywords set to slider.
  • description changed.

Do you have a fix?

(in reply to: ↑ 3 ) 03/06/07 21:31:35 changed by almsy

Replying to bitsweat:

Do you have a fix?

Nothing yet. It's really getting frustrating!

03/06/07 21:54:28 changed by almsy

It seems to be that Safari isn't setting the handle and track length when the object is created because it's hidden.

Here is a dump of the first slider that doesn't work:

 'trackLength' => NaN,
 'handleLength' => [undefined],

And the slider that does

 'trackLength' => 200,
 'handleLength' => 5,

I'll keep trying to find a solution. Any help on this would be appreciated.

Mike