2013-04-02 6 views
0

Google 캘린더에 가젯으로 추가하면 부분적으로 화면 밖으로 나옵니다 ... 가젯이 화면에 표시되도록 수정해야합니다 ...내 Google 가제트가 부분적으로 화면 밖으로 나옴

여기

난 그냥 절차가 너무 화면

enter code here 
<?xml version="1.0" encoding="UTF-8"?> 
<Module> 
    <ModulePrefs title="ABC Google Calendar Gadget" width="180" author="abc" author_email="abcgmail.com" description="My First Test"> 
<Require feature="dynamic-height"/> 
<Require feature="google.calendar-0.5"/> 
    </ModulePrefs> 
    <Content type="html"> 
    <![CDATA[ 
<html style="overflow: hidden;"> 
<head> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 

<style> 
//.login { 
// display: block; 
//} 
//.event { 
// display: none; 
/} 
</style> 

</head> 
<body class="loc-en ff ff3"> 

<script> 

var _message = 'This is My first Gadget!'; 
function validateForm(){ 
alert("Hello"); 
$('.login').hide(); 
$('.event').show(); 
} 
function createEventfun(){ 
alert("create event"); 
var eventData = { 
    title: 'NewYear', 
    details: 'Hi all', 
    location: 'My room', 
    allDay: true, 
    startTime: {year: 2013, month: 04, date: 21}, 
    endTime: {year: 2013, month: 04, date: 22}, 
    attendees: [ 
     {email: '[email protected]'} 
    ], 
    rrule: 'RRULE:FREQ=YEARLY' 
    }; 
google.calendar.composeEvent(eventData); 
} 

function load() 
{ 
alert("Page is loaded"); 
} 

function changeWidth(){ 
     var e1 = document.getElementById("gadgetcell"); 
     e1.style.width = 180; 
     alert("Page is loaded and width of gadgetcell is modified to 180"); 
    } 

</script> 

<div class="login" align="left"> 
<table border="1" height="200" width="100%"> 
<tr> 
<td> 
<image src="http://abc.com/Portals/78096/images/abc_logo.jpg" height="60" width="90"/> 
</td> 
</tr> 
<tr> 
<td align="left"> 
<table border="0"> 
<tr> 
<td>Userid</td> 
<td><input type="text" name="userid" size=10/><br></td> 
</tr> 
<tr> 
<td>Password</td> 
<td><input type="password" name="password" size=10/><br></td> 
</tr> 
<tr> 
<td>VidyoURL</td> 
<td><input type="text" name="url" size=10/><br></td> 
</tr> 
<tr> 
<td><button onClick="validateForm()" style="background-color:red;color:white">LOGIN</button></td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</div> 
<div class="event" style="width: 180px;"> 
<table border="1"> 
<tr> 
<td> 
<image src="http://abc.com/Portals/78096/image/abc_logo.jpg" height="60" width="90"/> 
</td> 
</tr> 
<tr> 
<td align="center"> 
<table border="0" height="200" width="100%"> 
<tr> 
<span>User Successfully Aunthenticated</span> 
</tr>&nbsp; 
<tr> 
<button onclick="createEventfun()" style="background-color:red;color:white">CREATE VIDYO EVENT</button> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</div> 
</body> 
</html> 
]]></Content> 
</Module> 

답변

1

에 함께 표시하는 가젯을 만들 알고 싶어

..이 사용자 이름 및 암호와 로그인 버튼을 요청 가젯을 생성하는 코드입니다 Managing Gadget Height보기 :

- A <Require feature="dynamic-height"/> tag (under <ModulePrefs>) to tell the 
    gadget to load the dynamic-height library. 
- A call to the JavaScript function gadgets.window.adjustHeight() whenever there 
    is a change in content, or another event occurs that requires the gadget to 
    resize itself. 

나는 모든보기에이 스크립트를 추가하고 그것을 작동 :

<script type="text/javascript" charset="utf-8"> 
    function resize(){ 
     gadgets.window.adjustHeight(); 
    } 
    window.onload=resize; 
</script> 

"필수 기능"에 대해 잊지 마세요 태그

관련 문제