ASP.NET AJAX in Action phần 10

Việc chuyển đổi bạn sẽ xây dựng không phải là phức tạp, nhưng nó có hiệu quả, như thể hiện trong hình 10,18. Trong khi hình ảnh tiếp theo đang được nạp, bạn có một phần fade-out hình ảnh hiện tại, sau đó, bạn thay đổi kích thước cho đến khi nó đạt đến chiều rộng và chiều cao của hình ảnh để hiển thị. | 480 CHAPTER 13 Implementing common Ajax patterns page together with the drag-and-drop components. The ScriptManager control looks like this asp ScriptManager ID scriptManager runat server Scripts asp ScriptReference Assembly Name asp ScriptReference Assembly Name Scripts asp ScriptManager After the ScriptManager control you have to define the static HTML that will become the drag-drop list. To obtain the kind of layout shown in figure you style two div elements as the two columns that host the draggable widgets. This is done in a CSS file referenced in the page which isn t included in the following listings. You can access and run the complete source code for this example after downloading it from gallo. Listing shows the static HTML to add to the page. Listing Static HTML for the declarative widgets example div class widgets -- Left List -- div id leftArea class left_col -- Widget 1 -- div id widget1 class widget div id widget1_Handle class widget_handle Widget 1 div div class widget_content asp Login ID myLogin runat server CssClass centered asp Login div div Left-side list Bf -- Widget 2 -- div id widget2 class widget div id widget2_Handle class widget_handle Widget 2 div div class widget_content span Enter some text span asp TextBox ID TextBox1 runat server asp TextBox div div Widget div Declarative widgets 481 -- Right List -- div id rightArea class right_col -- Widget 3 -- div id widget3 class widget div id widget3_Handle class widget_handle Widget 3 div div class widget_content asp Calendar ID Calendar1 runat server CssClass centered asp Calendar div div div -- Templates -- div class templates -- Drop Cue template -- 0 Drop iCue div id dropCueTemplate class drop_cue div ------1 template -- Empty template -- div id emptyTemplate class emptyList Drop widgets here. div I jE Empty div template div The static HTML includes two div .