文档章节

cesium默认全屏按钮自定义

o
 osc_isezqdgg
发布于 2019/09/18 10:41
字数 246
阅读 9
收藏 0

精选30+云产品,助力企业轻松上云!>>>

cesium默认全屏按钮自定义

1  隐藏默认的svg

2  修改它默认的按钮边框,背景

3   修改它点击时的样式

代码如下:

 1 .cesium-viewer-fullscreenContainer {
 2     position: absolute;
 3     top: 100px;
 4     right: 24px;
 5     width: 48px;
 6     height: 48px;
 7 }
 8 
 9 .cesium-button:focus {
10     border-color: #001328;
11 }
12 
13 .cesium-button {
14     background-color: #001328;
15     fill: #001328;
16     background-image: url("../images/fullScreen.png");
17     background-size: 20px;
18     background-repeat: no-repeat;
19     background-position: center;
20 }
21 
22 .cesium-button:hover {
23     border: 1px solid #22272B;
24     background-color: #001328;
25     background-image: url("../images/fullScreen.png");
26     background-size: 20px;
27     background-repeat: no-repeat;
28     background-position: center;
29 }
30 
31 .cesium-svgPath-svg {
32     display: none;
33 }

效果如下:

 

 这个按钮就是我自定义的了。

.cesium-viewer-fullscreenContainer 可以改变按钮的位置和大小

.cesium-button:focus 改变点击时的颜色等

.cesium-button 控制按钮的背景色啥的

.cesium-button:hover 为了更改它默认时的划过设置,你可以再根据需要自定义一个,覆盖它原来的样式

.cesium-svgPath-svg 这就是cesium按钮中画的那个图,你可以给它隐藏了

 

 

 

 



o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
Cesium入门4 - 创建Cesium Viewer

Cesium入门4 - 创建Cesium Viewer Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 任何Cesium应用程序的基础都是Viewer。Viewer是一个带有多种功能的可交...

osc_9z0e3l8u
2018/11/19
8
0
cesium编程入门(四)界面介绍及小控件隐藏

感性认识 界面介绍,viewer Geocoder : 查找位置工具,查找到之后会将镜头对准找到的地址,默认使用bing地图 Home Button :视角返回初始位置. Scene Mode Picker : 选择视角的模式,有三种:...

osc_bswpz1oi
2018/01/15
3
0
cesium js学习一加载三维模型【转】

http://blog.csdn.net/tangyajun_168/article/details/50936698 最近项目中用到室外三维模型与室内三维地图交互,室外三维模型的加载我们采用了cesium js来实现,在使用的过程中遇到了许多的问...

osc_it9fazjn
2018/03/09
35
0
Cesium入门4 - 创建Cesium Viewer

Cesium入门4 - 创建Cesium Viewer Cesium中文网:http://cesiumcn.org/ 国内快速访问:http://cesium.coinidea.com/ 任何Cesium应用程序的基础都是Viewer。Viewer是一个带有多种功能的可交互...

CoinIdea
2018/08/22
719
0
2、cesium页面小控件的隐藏

cesium页面小控件的隐藏 一、 创建一个Viewer   var viewer = new Cesium.Viewer('cesiumContainer');//cesiumContainer为div中的id。 二、Viewer中会有下面这些内容 1 Geocoder:一种定位搜......

osc_snzhxf3u
04/16
2
0

没有更多内容

加载失败,请刷新页面

加载更多

使用CSS按比例调整图像大小? [重复] - Resize image proportionally with CSS? [duplicate]

问题: This question already has an answer here: 这个问题在这里已有答案: How do I auto-resize an image to fit a 'div' container? 如何自动调整图像大小以适合“div”容器? 31 ans......

fyin1314
今天
18
0
define()与const - define() vs. const

问题: In PHP, when do you use 在PHP中,何时使用 define('FOO', 1); and when do you use 以及何时使用 const FOO = 1; ? ? What are the main differences between those two? 两者之......

法国红酒甜
今天
26
0
将Node.js升级到最新版本 - Upgrading Node.js to latest version

问题: So, I have Node.js installed and now when I tried to install Mongoosejs I got an error telling me that I don't have the needed version of Node.js (I have v0.4.11 and v0.4......

javail
今天
17
0
等到所有jQuery Ajax请求都完成了吗? - Wait until all jQuery Ajax requests are done?

问题: How do I make a function wait until all jQuery Ajax requests are done inside another function? 我如何让一个函数等到所有jQuery Ajax请求都在另一个函数中完成之后? In short...

富含淀粉
今天
17
0
OSChina 周日乱弹 —— 那么长的绳子,你这是放风筝呢

Osc乱弹歌单(2020)请戳(这里) 【今日歌曲】 @ 巴拉迪维:黑豹乐队的单曲《无地自容》 耳畔突然响起旋律,是那首老歌。中国摇滚有了《一无所有》不再一无所有;中国摇滚有了《无地自容》不...

小小编辑
今天
103
2

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部