cfdiv 바인딩을 사용할 때 삽입 그래픽 비활성화

Question

cfdiv가 새로 고침 될 때 "로드 중 ..."그래픽이 나타나지 않도록 할 방법이 있습니까? 그래픽을로드 한 다음 새 HTML을로드하는 깜박임을 방지하고 싶습니다.

Answer 1

, 그것은 "...로드"를 덮어 씁니다 HTML을하고 IE와 파이어 폭스 모두에서 깜박 거리는 효과를 방지하는 것이 할 것 같다 동안

<script language="JavaScript"> 
_cf_loadingtexthtml=""; 
</script> 

을 트릭이 있다면 페이지 당 또는 컨트롤 단위로로드 애니메이션을 사용자 정의 할 수있는 공식적으로 지원되는 방법이 있다면 좋을 것입니다. 바라건대 ColdFusion9에서 이러한 기능을 추가 할 수 있기를 바랍니다.

Answer 2

현재 프로그래밍 방식으로 cfdiv 태그 내에서이를 수행 할 방법이 없다고 생각합니다. 그 "Loading ..."메시지와 이미지를 정말로 제거하고 싶다면, 당신이 볼 수있는 몇 곳이 있습니다.

당신은 이름을 바꾸거나에있는 이미지를 삭제할 수 있습니다 : \ 아약스 \ 자원 CFIDE \ 스크립트를 \ CF 이미지 \ loading.gif \에만 애니메이션을 없애는

. 은 "로드 중 ..."텍스트가 빈 문자열로 지워졌 할 수 있으며,에 정의되어 CFIDE \ 스크립트 \ 아약스 메시지 \는 \ 분명히 다른 태그에 영향을 미칠 것입니다 이러한 변경 사항을 만들기

을 cfmessage.js cfdiv보다 낫지 만 한 곳에서이 행동을 없애기를 원한다면 다른 곳도 죽이지 않을 것이라고 확신합니다. :)

나는 다른 사람이 아이디어를 가지고 있다면 이것을하는 더 깨끗한 방법을보고 싶습니다. 헤더의 맨 아래에 다음 줄을 추가하여

Answer 3

메시지와 이미지를 새로운 값으로 설정할 수있는 ajax로드를 호출하기 전에 메시지를 변경하는 함수를 작성할 수 있습니다.

function loadingOrder(){ 
    _cf_loadingtexthtml="Loading Order Form <image src='/CFIDE/scripts/ajax/resources/cf/images/loading.gif'>"; 
} 

function loadingNavigation(){ 
    _cf_loadingtexthtml="Loading Menu <image src='/CFIDE/scripts/ajax/resources/cf/images/loading_nav.gif'>"; 
} 

나는이 기능을 사용하여 메인 왼쪽 탐색 cfdiv 모두로드 내 프로세스의 일부에서

(이 결국 TEXT_VALUE와 IMAGE_PATH 매개 변수를 모두 취할 것 하나의 기능으로 출시 될 예정) 다음과 같이하십시오 :

function locateCreateOrder(){ 
    loadingOrder(); 
    ColdFusion.navigate('/functional_areas/orders/orders_actions/cf9_act_orders_index.cfm','main_content'); 
    loadingNavigation(); 
    ColdFusion.navigate('/functional_areas/products/products_actions/cf9_products_menu.cfm','left_menu'); 
} 

Answer 4

이것은 포괄적 인 또는 우아한 해결책은 아니지만 인접 요소에 음수 여백을 사용하면 애니메이션을 "덮을"수 있음을 발견했습니다. 이 방법이 모든 경우에 적용되는지는 모르겠지만 특별한 경우에는 효과가있었습니다. 연결된 텍스트 필드 옆에 애니메이션이 표시되고 오른쪽에는 제출 버튼이 나타납니다. 레이어가 오른쪽으로 떠있었습니다. 제출 버튼에 음수 여백을 사용했으며 레이어 정렬에 영향을 미치지 않고 애니메이션을 덮었습니다.

은 내가 한 또 다른 법안은 계층 구조를 확인하기 위해, 그리고 내 CSS에 다음 코드를 반드시 추가 :

#TitleNameloadingicon {visibility:hidden;} 
#TitleName_cf_button {visibility:hidden;} 
#TitleNameautosuggest {background-color:#ffffff;}