2012-11-01 2 views
2

이 같은JQuery와 UI 슬라이더 숨겨진 HTML 코드에서

<div id="slider1" class="slide1" style="overflow: visible !important; position: absolute !important; margin-top: 0px !important;"></div> 

slider.js

$("#slider1").slider({ 
    min: 0, 
    max: 100, 
    step: 10, 
    value: 50, 
    slide: function (event, ui) { 
     $('#high').html(ui.value); 
    }, 
    change: function (event, ui) { 
     $('#high').attr('value', ui.value); 
    } 
}); 

slide.css

.slide1 { 
    float: left; 
    left: 600px; 
    height: 10px; 
    width: 150px; 
    top: 167px; 
    z-index: 2; 
} 

을 부여하지만조차 못해서 슬라이딩 슬라이더, Slider init 호출 전에 만 가져 오기. jquery를 사용하여 silder를 호출하면 자동 div 태그 생성과 해당 스타일이 overflow: hidden으로 설정되어 슬라이더가 숨겨집니다. 어떻게 이것을 피할 수 있습니까?

미리 감사드립니다.

답변

0

어떻게 '처음'을 의미합니까?

나는 바이올린으로 HTML/CSS/JS 하락했고 올바르게 작동하는 것 같다 : http://jsfiddle.net/2pcFh/

아래 목록 파일 삭제는 13.0.1

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> - jsFiddle demo</title> 

    <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script> 

    <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 


     <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css"> 





     <script type='text/javascript' src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script> 


    <style type='text/css'> 
    .slide1 { 
    float: left; 
    left: 600px; 
    height: 10px; 
    width: 150px; 
    top: 167px; 
    z - index: 2; 
} 
    </style> 



<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){ 
$("#slider1").slider({ 
    min: 0, 
    max: 100, 
    step: 10, 
    value: 50, 
    slide: function(event, ui) { 
     $('#high').html(ui.value); 
    }, 
    change: function(event, ui) { 
     $('#high').attr('value', ui.value); 
    } 
}); 



});//]]> 

</script> 


</head> 
<body> 
     <div id="slider1" class="slide1" style="overflow: visible !important; position: absolute !important; margin-top: 0px !important;"></div> 


</body> 


</html> 
+0

파이어 폭스에서 나를 위해 로컬로 작동 사실이 슬라이더는 jequery 대화 상자에 놓으 려합니다. 슬라이더를 클릭하면 위치 : 절대 위치, 위치 : 절대 위치, 부드럽게 작동 할 것, 절대 위치가 필요합니다. 내 사이트를 시도했을 때 절대 위치가 필요하지 않습니다. show .. can 다른 어떤 형식으로 보여주기 – Dipss

+0

plz slider()를 호출 할 때 자동 div 생성을 피하도록 도와주세요. – Dipss

관련 문제