• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript dom.toggleClass函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中vs/base/browser/dom.toggleClass函数的典型用法代码示例。如果您正苦于以下问题:TypeScript toggleClass函数的具体用法?TypeScript toggleClass怎么用?TypeScript toggleClass使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了toggleClass函数的8个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: create

	protected create(parent: HTMLElement): void {
		this.titleContainer = parent;
		this.titleContainer.draggable = true;

		//Container listeners
		this.registerContainerListeners();

		// Gesture Support
		Gesture.addTarget(this.titleContainer);

		const labelContainer = document.createElement('div');
		addClass(labelContainer, 'label-container');
		this.titleContainer.appendChild(labelContainer);

		// Editor Label
		this.editorLabel = this._register(this.instantiationService.createInstance(ResourceLabel, labelContainer, void 0));
		this._register(this.editorLabel.onClick(e => this.onTitleLabelClick(e)));

		// Breadcrumbs
		this.createBreadcrumbsControl(labelContainer, { showFileIcons: false, showSymbolIcons: true, showDecorationColors: false, breadcrumbsBackground: editorBackground });
		toggleClass(this.titleContainer, 'breadcrumbs', Boolean(this.breadcrumbsControl));
		this.toDispose.push({ dispose: () => removeClass(this.titleContainer, 'breadcrumbs') }); // import to remove because the container is a shared dom node

		// Right Actions Container
		const actionsContainer = document.createElement('div');
		addClass(actionsContainer, 'title-actions');
		this.titleContainer.appendChild(actionsContainer);

		// Editor actions toolbar
		this.createEditorActionsToolBar(actionsContainer);
	}
开发者ID:developers23,项目名称:vscode,代码行数:31,代码来源:noTabsTitleControl.ts


示例2: _sliderMouseDown

	private _sliderMouseDown(e: StandardMouseEvent): void {
		if (e.leftButton) {
			let initialMouseOrthogonalPosition = this._sliderOrthogonalMousePosition(e);
			let initialScrollPosition = this._getScrollPosition();
			let draggingDelta = this._sliderMousePosition(e) - this._scrollbarState.getSliderPosition();
			DomUtils.toggleClass(this.slider, 'active', true);

			this._mouseMoveMonitor.startMonitoring(
				standardMouseMoveMerger,
				(mouseMoveData: IStandardMouseMoveEventData) => {
					let mouseOrthogonalPosition = this._sliderOrthogonalMousePosition(mouseMoveData);
					let mouseOrthogonalDelta = Math.abs(mouseOrthogonalPosition - initialMouseOrthogonalPosition);
					// console.log(initialMouseOrthogonalPosition + ' -> ' + mouseOrthogonalPosition + ': ' + mouseOrthogonalDelta);
					if (Platform.isWindows && mouseOrthogonalDelta > MOUSE_DRAG_RESET_DISTANCE) {
						// The mouse has wondered away from the scrollbar => reset dragging
						this.setDesiredScrollPosition(initialScrollPosition);
					} else {
						let desiredSliderPosition = this._sliderMousePosition(mouseMoveData) - draggingDelta;
						this.setDesiredScrollPosition(this._scrollbarState.convertSliderPositionToScrollPosition(desiredSliderPosition));
					}
				},
				() => {
					DomUtils.toggleClass(this.slider, 'active', false);
					this._parent.onDragEnd();
				}
			);

			e.preventDefault();
			this._parent.onDragStart();
		}
	}
开发者ID:ErickWendel,项目名称:vscode,代码行数:31,代码来源:abstractScrollbar.ts


示例3: redraw

	private redraw(): void {
		const editor = this.group.activeEditor;
		this.lastRenderedActiveEditor = editor;

		const isEditorPinned = this.group.isPinned(this.group.activeEditor);
		const isGroupActive = this.accessor.activeGroup === this.group;

		// Update Breadcrumbs
		if (this.breadcrumbsControl) {
			if (isGroupActive) {
				this.breadcrumbsControl.update();
				toggleClass(this.breadcrumbsControl.domNode, 'preview', !isEditorPinned);
			} else {
				this.breadcrumbsControl.hide();
			}
		}

		// Clear if there is no editor
		if (!editor) {
			removeClass(this.titleContainer, 'dirty');
			this.editorLabel.clear();
			this.clearEditorActionsToolbar();
		}

		// Otherwise render it
		else {
			// Dirty state
			this.updateEditorDirty(editor);

			// Editor Label
			const resource = toResource(editor, { supportSideBySide: true });
			const name = editor.getName() || '';

			const { labelFormat } = this.accessor.partOptions;
			let description: string;
			if (this.breadcrumbsControl && !this.breadcrumbsControl.isHidden()) {
				description = ''; // hide description when showing breadcrumbs
			} else if (labelFormat === 'default' && !isGroupActive) {
				description = ''; // hide description when group is not active and style is 'default'
			} else {
				description = editor.getDescription(this.getVerbosity(labelFormat)) || '';
			}

			let title = editor.getTitle(Verbosity.LONG);
			if (description === title) {
				title = ''; // dont repeat what is already shown
			}

			this.editorLabel.setLabel({ name, description, resource }, { title, italic: !isEditorPinned, extraClasses: ['no-tabs', 'title-label'] });
			if (isGroupActive) {
				this.editorLabel.element.style.color = this.getColor(TAB_ACTIVE_FOREGROUND);
			} else {
				this.editorLabel.element.style.color = this.getColor(TAB_UNFOCUSED_ACTIVE_FOREGROUND);
			}

			// Update Editor Actions Toolbar
			this.updateEditorActionsToolbar();
		}
	}
开发者ID:developers23,项目名称:vscode,代码行数:59,代码来源:noTabsTitleControl.ts


示例4:

		this._requestModificationFrame(() => {
			StyleMutator.setWidth(this._domNode, this._width);
			dom.toggleClass(this._domNode, ClassNames.SCROLL_DECORATION, this._shouldShow);
		});
开发者ID:1424667164,项目名称:vscode,代码行数:4,代码来源:scrollDecoration.ts


示例5: enabled

	public set enabled(value: boolean) {
		dom.toggleClass(this.container, 'disabled', !value);
		this.selectElement.disabled = !value;
	}
开发者ID:StateFarmIns,项目名称:vscode,代码行数:4,代码来源:selectBox.ts


示例6: handleBreadcrumbsEnablementChange

	protected handleBreadcrumbsEnablementChange(): void {
		toggleClass(this.titleContainer, 'breadcrumbs', Boolean(this.breadcrumbsControl));
		this.redraw();
	}
开发者ID:developers23,项目名称:vscode,代码行数:4,代码来源:noTabsTitleControl.ts


示例7: render

	public render(ctx: IRestrictedRenderingContext): void {
		StyleMutator.setWidth(this._domNode, this._width);
		dom.toggleClass(this._domNode, ClassNames.SCROLL_DECORATION, this._shouldShow);
	}
开发者ID:StateFarmIns,项目名称:vscode,代码行数:4,代码来源:scrollDecoration.ts


示例8:

				() => {
					DomUtils.toggleClass(this.slider, 'active', false);
					this._parent.onDragEnd();
				}
开发者ID:ErickWendel,项目名称:vscode,代码行数:4,代码来源:abstractScrollbar.ts



注:本文中的vs/base/browser/dom.toggleClass函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript dom.EventHelper类代码示例发布时间:2022-05-25
下一篇:
TypeScript dom.show函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap