現在作成中のサイトにjquery のFullCalendarを実装しました。

http://arshaw.com/fullcalendar/docs/mouse/eventClick/

googleカレンダーと同期し、更新も楽なのはいいのですが。

スケジュールのイベントをクリックするとgoogleカレンダー上のイベント詳細のページに飛んでしまうので悩んでます。
折角、サイト上で、cssにてデザインしたにもかかわらず。
googleの簡素な詳細ページに飛ぶのはいかがなものかと。

イベントをクリックするとツールチップや吹き出しのようなもので、詳細が見えるという形が理想です。

当方、プログラムにはとんと弱く。。
どなたか詳しい方ご教授いただけるとありがたく存じます。

回答の条件
  • URL必須
  • 1人2回まで
  • 13歳以上
  • 登録:2010/07/02 22:26:54
  • 終了:2010/07/09 22:30:03

回答(2件)

id:Cherenkov No.2

Cherenkov回答回数1503ベストアンサー獲得回数4932010/07/03 00:11:46

ポイント35pt

サンプルを作ってみました。

http://cherenkov.hp.infoseek.co.jp/tmp/sample/hatena/examples/de...

$('#calendar').fullCalendar({
  events: $.fullCalendar.gcalFeed("googleカレンダーrssのurl"),
  eventClick: function(calEvent, jsEvent, view) {
    return (function(){
      //console.log(calEvent)//RSSデータはfirebugでみてね。
      var startTime = calEvent.start ? calEvent.start.toLocaleTimeString() : "";
      var endTime = calEvent.end ? calEvent.end.toLocaleTimeString() : "";
      $('<div><p>'+ startTime + '~' + endTime + '</p><p>' + calEvent.description + '</p></div>').dialog({
	    title: calEvent.title,
      });
      return false;
    })();
  }
});
  • eventClickでreturn falseすればgoogleへはジャンプしなくなります。
  • jquery uiを付け足して、ダイアログを使って詳細表示してみました。

参考


*この質問の下のコメント欄を有効にしたほうが有益です。

id:cont96

ありがとうございます!

たすかりました。

これを参考に進めたいとおもいます。

2010/07/05 15:51:52

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません