本项目我们首先进行“党建工作”页面的设计，通过本页面的设计，我们JQuery的基本语法与使用，熟练使用JQuery、JavaScript、插件Swiper等进行轮播图的设计，并能使用他们进行页面交互效果的添加。

【 案例展示 】

学习任务

重点、难点

突破方法

1. ”党建工作”页面实现。

1. JQuery的使用。

2. 教学难点：页面交互效果的实现。

采用翻转课堂、项目导入的教学模式，采用分组讨论、案例教学、演示动画等教学方法，运用在线教学平台。

知识目标

能力目标

素质目标

1.掌握JQuery的基本语法；

2.掌握JavaScript实现页面交互；

3.掌握JQuery实现动画的方法；

4.掌握“党建工作”页面设计实现。

1.能够熟练应用JQuery完成基本操作；

2.能够利用JavaScript实现页面交互；

3.能够利用JQuery实现页面动画；

4.能够实现“党建工作”页面设计。

1.具有爱国爱党的爱国主义情怀；

2.提升职业自豪感；

3.具有实践动手能力；

4.具备团队协作精神。

课程思政——爱国主义教育

【课前导学区】

   1、发布任务

         导学任务单

   2、辅学资源

         电子讲义

         电子课件

         教学设计

【 视频讲解】

知识储备及案例实现

任务2 “党建工作”页面实现

1、页面内容实现

2、图片样式

3、图标引入

4、段落效果

【 课后自测区 】

自评自测

     扫描二维码回答问题                                    扫描二维码自测

   1、 材料阅读                                           【简介】讲好党故事案例展示。

   爱国主义教育展示2

【 资料下载 】

单元设计

教学设计18-“党建工作”页面实现.pdf

课程教案

教案18-“党建工作”页面实现.pdf

演示文稿

项目6 公司网站“党建工作“页面设计.pptx

任务工单

公司网站“党建工作”的页面设计

素材下载

     1、区块划分前基本的css文件.rar

    项目6 轮播图图片素材下载.rar

    项目6 图片素材下载.rar

课内同步项目

   “党建工作”移动端页面设计

课外扩展项目

    漂亮扁平化摄影师作品展示网页.rar   

练习题

  1、练习1

疑难问题解答

   1、JQuery使用的优点有哪些？