Ipad 웹 사이트에서 AjaxCalender 컨트롤을 더 큰 크기로 만드는 방법은 무엇입니까?

Question

기본 아약스 캘린더의 스타일을 재정 의하여 더 큰 크기로 ajax Calander 컨트롤을 만들고 싶습니다.

더 크게보아야합니다. 시도했지만 잘 작동하지 않는 달/년보기를 선택하려고 할 때 ..

여기 내가 정확히 ajax 캘린더 컨트롤과 함께하고 싶은 스크린 샷을 첨부했습니다.

은 가능한 그 아이 패드의 웹 사이트에 대한 더 크게 보려면 만들 것인가?

또는 Ipad 웹 사이트에 대한 나에게 좋은 캘린더 제어 제안, asp.net 웹 사이트를 사용하고 싶습니다.

감사 abhishek는

Answer 1

난 그냥이를 통해 자신을이었다. 당신이해야 할 3 가지가 있습니다.

처음으로 - 컨트롤에 CSS 클래스를 추가하십시오. 그러나이 작업을 수행하는 경우가 ajax__calendar의 기존 클래스 잎사귀 등 기존 스타일의 대부분은 그렇게 bigcal 새 클래스 인 CalendarExtender

CssClass="ajax__calendar bigcal" 

에 추가 조심.

두 번째 - bigcal 클래스를 사용하여 스타일을 지정하려면 CSS를 추가하십시오.

.bigcal .ajax__calendar_container { width: 220px; font-size:14px;} 
.bigcal .ajax__calendar .ajax__calendar_container {border: 3px solid #646464;} 
.bigcal .ajax__calendar_days, .bigcal .ajax__calendar_months, .bigcal .ajax__calendar_years, .bigcal .ajax__calendar_body 
{width:220px;height:200px} 
.bigcal .ajax__calendar_month, .bigcal .ajax__calendar_year{height:55px;padding-top:4px} 
.bigcal .ajax__calendar_container table, .bigcal .ajax__calendar_container TD {font-size:14px} 
.bigcal .ajax__calendar_days td div{padding:4px 5px 4px 4px} 

공지 사항 난 폭 220, 높이 200으로의 크기를 재설정 한 - 이에 따라

셋째을 조정 - 당신이 세트에 기본값 왜냐하면, 자바 스크립트에서의 크기를 변경해야 스크롤하는 등의 크기가 작동합니다. 그래서

함수 JS 다음 CalendarExtender에 다음

OnClientShown="setBigCal" 

및 다음 추가

function setBigCal(sender, e) { 
    sender._height = 200; 
    sender._width = 220; 
} 

HTH :)

수정 - 죄송합니다 - 그냥이 질문에 날짜를 볼 수 있도록 나는 당신이 이미 분류되어 있다고 가정합니다. 하지만 다른 누구도 같은 문제가 발생하면 답을 남겨 둘 것입니다.

Answer 2

내 대답이 늦었다는 것을 알고 있습니다. 아약스 캘린더에 대해 묻고있는 거 알아. 그러나 그것은 다른 사람들을 도울 수 있습니다. 몇몇 프로그래머들은 asp.net 달력을 포맷하는 방법을 묻습니다. 다음 스타일을 사용하여 asp.net 달력을 포맷 할 수 있습니다.

.calander { 
    background-color: whitesmoke; 
    border: 1px solid; 
    height: 305px; 
    width: 280px; 
} 

    .calander table tr td { 
     padding: 10px; 
    } 

     .calander table tr td:hover { 
      background-color:rgb(200, 255, 0); 
     } 

.ajax__calendar_today { 
    background-color: rgb(209, 233, 255) !important; 
    border-radius: 3px; 
} 

.ajax__calendar_footer { 
    background-color: rgb(209, 233, 255) !important; 
    width: 100% !important; 
    margin: 0px !important; 
    padding: 0px !important; 
    position: relative !important; 
    height: auto !important; 
} 

.ajax__calendar_active { 
    background-color: rgb(200, 255, 0) !important; 
    border-radius: 3px; 
} 

.ajax__calendar_day { 
    height: 20px !important; 
    width: 20px !important; 
    padding: 0px; 
    text-align: center; 
    margin-top: -8px; 
    margin-left: -5px; 
} 

.ajax__calendar_body { 
    width: 270px !important; 
    height: 245px !important; 
} 

.ajax__calendar_container { 
    width: auto !important; 
} 

이러한 스타일은 원하는대로 사용자 정의 할 수 있습니다.