1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
| <template>
| <!-- 头部广告 -->
| <div class="advertising" v-if="show" :style="{'background-color': data.bgColor}">
| <img :src="data.img" class="hover-pointer" @click="linkTo(data.url)"/>
| <Icon type="md-close-circle" size="20" @click="show = false" />
| </div>
| </template>
| <script>
| export default {
| props: {
| data: { // 传入的广告信息
| type: Object,
| default: null
| }
| },
| data () {
| return {
| show: true // 是否显示头部广告
| }
| }
| };
| </script>
| <style scoped lang="scss">
| .advertising {
| height: 80px;
| width: 100%;
|
| text-align: center;
| overflow: hidden;
| position: relative;
| > img {
| width: 1200px;
| height: 100%;
| }
| *:nth-child(2){
| position: relative;
| right: 36px;
| top: -57px;
| cursor: pointer;
| }
| }
| </style>
|
|