클릭/HTML에서 버튼의 배경색을 변경하는 방법

"자세히 보기"와 비슷한 버튼을 만들었고, 이 버튼을 누르면 텍스트가 아래로 확장됩니다. 텍스트가 확장되면 버튼의 배경이 변경되고 버튼을 다시 눌러 텍스트를 닫으면(예: "간단히 읽기") 버튼의 배경이 원래 상태로 돌아갑니다. 이 함수를 구현하는 방법 functionmyFunction(){vardots=document.getElementById("dots");varmoreText=document.getElementBy

P粉502608799 2023-09-08 00:04:48 0  1  514

대화상자의 플로팅 버튼이 계속 겹쳐집니다.

안녕하세요. 저는 Mauiblazor 앱을 만들고 있는데 부동 버튼이 있는 전체 페이지 크기 대화 상자가 있습니다. 대화 상자가 닫히고 원본 페이지로 돌아가면 원본 페이지에서 대화 상자 버튼이 있는 위치에 데드 스페이스가 있습니다(대화 상자에서는 조건에 따라 버튼의 가시성을 변경합니다). 플로팅 버튼에 사용하는 스타일: .center{bottom:5%;z-index:999;cursor:pointer;margin:0;position:fixed;left:50%;-

P粉032977207 2024-03-22 08:20:59 0  1  384

타사 서버에서 이미지 다운로드 버튼

어떤 브라우저에서든 이미지가 보이면 마우스 오른쪽 버튼을 클릭하고 "다른 이름으로 저장"을 클릭하여 다운로드할 수 있습니다. 이미지를 다운로드하는 버튼을 만들려고 합니다. 다운로드 버튼은 위의 이미지인 바코드를 다운로드해야 합니다. 나는 반응을 사용하고 있는데 이것이 답변과 관련이 있는지 확실하지 않습니다. 다운로드 속성과 함께 <a/> 태그를 사용할 수 있다는 내용을 읽었지만 저는 Firefox를 사용하고 있는데 바코드 이미지를 호스팅하는 페이지로 리디렉션되고 다운로드 창이 열리지 않습니다. 코드는 매...

P粉198670603 2024-02-21 14:47:20 0  1  361

Angular에서 모달 외부를 클릭하면 모달이 닫히는 것을 방지하는 방법은 무엇입니까?

이 문제에 대한 여러 Q&A를 읽었으며 모든 제안은 매우 간단한 솔루션에 대한 것입니다. 모달 열기를 담당하는 버튼의 HTML 태그에 data-backdrop="static" data-keyboard="false를 추가하세요. 이 버튼은 다음과 같습니다:<buttontype="button"class="btnbtn-primarybtn-dange

P粉805107717 2023-09-13 20:32:07 0  1  732

중앙에 텍스트와 아이콘이 있는 버튼

아이콘과 텍스트가 포함된 버튼 구성 요소를 개발 중입니다. 아이콘은 버튼 왼쪽에 배치되고 텍스트는 버튼 중앙에 정렬됩니다. 텍스트가 버튼에 맞지 않는 경우 줄바꿈해서는 안 되지만 잘릴 수 있습니다. 텍스트를 자르는 핵심 조건은 아이콘이 버튼 가장자리에서 떨어져 있는 것처럼 텍스트가 버튼 가장자리에서 떨어져 있어야 한다는 것입니다. 따라서 버튼에 동일한 인라인 패딩을 추가할 수 없습니다. 텍스트가 잘리지 않으면 버튼 중앙에 정렬됩니다. 그러나 아이콘과 겹치기 시작하거나 버튼에 맞지 않으면 텍스트가 잘립니다. 즉, 일반상태에서는 아이콘...

P粉033429162 2023-08-15 11:01:09 0  1  522

요소 자체를 클릭하거나 다른 버튼을 클릭할 때 요소의 속성 값을 재설정하려면 어떻게 해야 합니까?

클릭을 수신하는 일반 JavaScript가 있는데 클릭하면 네 가지 일이 발생합니다. "form-opened" 클래스가 버튼에 추가되고 "aria-expanded" 속성이 "true"로 설정되어 이전에 숨겨진 div가 표시됩니다. . 버튼의 "이후" 텍스트가 "Closeinfo"로 변경됩니다. (이는 버튼에 새 클래스 "form-opened"가 포함되어 있는지 여부에 따라 CSS를 통해 제어됩니다.) 다른 버튼을 클릭하면 처음...

P粉652495194 2024-03-28 14:38:32 0  1  449

모든 아코디언을 켜고 끄는 버튼을 어떻게 설정하나요?

다음 코드를 사용하여 축소 가능한 아코디언을 생성하는 구성 요소가 있습니다. importReact,{useState}from'react';constCollapsible=(props)=>{const[open,setOpen]=useState(false);consttoggle=()= > {setOpen(!open);}return(<div><buttonclassName={

P粉391677921 2023-08-30 16:57:51 0  2  669

MUI 스위치와 함께 React Hook Form 7을 사용하는 방법

MUI 스위치와 함께 React-hook-form을 사용하는 경우 값이 true로 설정되어 있어도 페이지가 로드될 때 스위치는 초기 값을 표시하지 않습니다. 그러나 버튼을 터치하지 않고 양식을 제출하면 값이 true로 정의된 스위치에 대해 true가 반환되므로 이는 표시 문제인 것으로 보입니다. 게다가 이 버튼(false로 표시됨)을 한 번 클릭하면 아무런 효과가 없으며(여전히 왼쪽에 유지됨) 두 번째 클릭을 하면 실제로 다시 전환됩니다. 후크를 사용하여 초기 값 설정(다른 모든 필드 유형에 적용): useEff

P粉231112437 2023-09-16 19:43:09 0  1  616

mysql - postgreSQL 데이터베이스는 테이블 필드의 기본 데이터 정렬을 어떻게 설정합니까?

이제 날짜 필드가 있는 새 테이블을 만듭니다. 데이터의 모든 행이 표시되면 정렬 필터 버튼 설정을 통해 정렬 규칙을 변경할 수 있지만 창을 닫았다가 다시 열면 표시가 다시 엉망이 됩니다. 어떻게 해결하나요?

怪我咯 2017-05-17 10:01:37 0  1  902

이름이 laravel과 일치하는 다른 테이블에서 데이터 가져오기

시작하기 전에 내 코드가 영어가 아니기 때문에 일부 번역이 필요합니다. 공급자 = 공급업체 작업 = 작업 따라서 공급업체 테이블과 워크시트라는 두 개의 테이블이 있습니다. 각 공급자는 여러 저작물을 소유할 수 있으며, 각 저작물은 하나의 공급자만 소유할 수 있습니다. 일대다 관계여야 합니다. 이것은 내 테이블 벤더 테이블 작업대이므로 LARAVEL을 프레임으로 사용하고 있습니다. 작업 버튼이 있는 공급업체 테이블을 만들었고 이것이 작동하기를 원합니다. 버튼을 클릭하면 정확한 공급업체 이름이 소유한 작업(pekerjaan) 목록이 표...

P粉378264633 2024-01-29 12:28:44 0  1  406

버튼에 속성 비활성화를 설정할 수 없습니다.

아래 표시된 코드에서는 버튼을 생성하고 비활성화 속성을 추가하려는 하위 구성 요소를 개발 중입니다. 아래 코드에서 비활성화 속성은 빨간색으로 밑줄이 그어져 있고 다음과 같은 오류 메시지가 나타납니다. '"isDigitizePolygonDisabled"' 유형은 'Booleanish|undefine' 유형에 할당할 수 없습니다. 비활성화 속성을 올바르게 설정하는 방법을 알려주십시오. 코드: import{ref} 'vue'레티스에서

P粉039633152 2023-08-16 20:54:18 0  1  515

마우스가 떠나기 전에 모든 값을 커밋하는 대신 마우스가 떠날 때 슬라이더의 값을 어떻게 커밋합니까?

입력 상자와 슬라이더가 있는데 슬라이더의 범위는 1에서 100까지입니다. 토글 스위치와 드롭다운 메뉴가 있으므로 슬라이더를 포함한 제출 버튼을 사용하는 대신 onChange 이벤트를 사용하여 각 필드의 변경 사항을 처리합니다. 그런데 문제가 있습니다. 슬라이더를 1에서 50으로 변경하려고 하면 1에서 50까지의 모든 값이 onChange 이벤트에 제출됩니다.

P粉129731808 2023-07-27 15:35:18 0  1  576

javascript - 하위 창이 팝업되고 작업 후 닫힙니다. 기본 창은 웹사이트의 일부 로그인 인터페이스, Django 배경 관리 등과 같은 해당 응답을 받게 됩니다. 이는 어떻게 이루어지나요?

웹 개발을 배우고 있는데 비슷한 기능을 구현하고 싶습니다. 다음은 Django 관리자의 예입니다. 예를 들어 내가 속한 프로젝트를 추가하거나 편집하려면 빨간색 원 안의 버튼을 직접 클릭한 다음 작은 버튼을 클릭합니다. 창이 팝업됩니다. 내용을 입력한 후 작은 창이 닫히고 기본 창이 그에 따라 응답합니다. ...

阿神 2017-06-05 11:10:39 0  2  842

HTML, CSS 및 SVG를 사용하여 확장 가능한 표지판 만들기

표지판(팁이 있는 직사각형) 형태의 버튼을 만들고 싶습니다. ________|\|_______/각 텍스트의 길이가 다른 텍스트를 로고에 동적으로 쓰고 싶습니다. 그래픽만 배경 그래픽으로 사용하여 이 작업을 시도하면 그에 따라 화살표의 크기가 조정되고 압축/늘어납니다. 따라서 이를 수행하는 방법은 텍스트를 일반 div에 넣고 CSS:after를 사용하여 화살표를 SVG로 추가하는 것입니다. 화살표는 완전히 채워져야 합니다. 즉, 프레이밍 문제를 다룰 필요가 없습니다. (가시성을 높이기 위해 SVG를 검정색으로 남겨 두었습니다.) 첫 ...

P粉555682718 2024-03-31 14:45:14 0  1  444

잡히지 않은 TypeError: this.saveAlpha는 eval의 함수가 아닙니다.

이 코드에는 시작 및 중지 버튼과 타이머가 있습니다. 이 링크에 표시된 것처럼 DeviceOrientationEvent와 같은 전화 정보와 절대, 알파, 베타 및 감마와 같은 속성을 얻고 싶습니다. 나는 그런 이벤트를 사용해 본 적이 없기 때문에 이와 같은 작업을 수행하는 방법을 모르겠습니다. 이러한 이벤트를 수신한 후 방향[]에 저장합니다. <템플릿><q-pagepadding><divclass=&quot

P粉930534280 2024-03-27 11:22:56 0  1  475

Ex-Admin은 JS에 신경 쓰지 않고 그래픽 드래그 앤 드롭을 사용하여 CURD를 생성합니다. PHP 코드만 사용하여 백엔드 시스템을 빠르게 구축할 수 있습니다.

Ex-AdminEx-Admin은 Vue의 Ant Design을 기반으로 개발된 백엔드 시스템 구축 도구로, 페이지 템플릿 JavaScript에 주의할 필요가 없으며, PHP 코드만 사용하여 모든 기능을 갖춘 백엔드 시스템을 빠르게 구축할 수 있습니다. . [중국어 문서][데모 / 온라인 데모][github] [gitee(codecloud)] 그래픽 커드 튜토리얼 기능 - 유연한 디자인, 다양한 PHP 프레임워크에 대한 액세스 지원, 백엔드 구성 요소의 객체 지향 프로그래밍 및 구성 요소 기반 개발&nbsp

Rocky 2022-07-21 12:27:18 0  0  795

순수 Javascript를 사용하여 이미지 교체를 위한 전환 효과 구현

내가 만든 웹사이트에는 여러 개의 아코디언이 있는데 각 아코디언의 상단에는 이미지가 있습니다. 아코디언을 펼치면 안에 설명이 들어가고 이미지가 다른 것으로 변경됩니다. 그런 다음 아코디언을 닫으면 이미지가 첫 번째 이미지로 다시 전환됩니다. 문제는 이 이미지 변경이 페이드 효과를 사용하여 부드럽게 전환되기를 원하는데 지금은 갑작스러운 변경일 뿐이라는 것입니다. 어떻게 해야 합니까? 아코디언 버튼의 ID가 "button"이고 첫 번째 이미지(두 번째 이미지로 변경됨)가 포함된 레이블의 ID가 "firstim...

P粉458913655 2024-03-30 00:14:11 0  1  423

"x" 또는 "닫기" 버튼을 클릭하면 부트스트랩 모달 상자를 닫을 수 없습니다.

모달을 열기 위해 클릭하면 모달이 잘 표시되고 닫기 버튼에 마우스가 모달 위에 있는 것으로 표시되지만 클릭해도 아무 일도 일어나지 않고 모달은 열린 상태로 유지됩니다. 이전에 이 문제를 겪거나 해결한 사람이 있나요? 여기서 볼 수 있는 것은 "data-bs-dismiss"를 추가하는 것뿐이지만 이는 스키마에 영향을 주지 않습니다. 나는 부트스트랩을 처음 접했기 때문에 모든 도움을 주시면 대단히 감사하겠습니다! 코드는 다음과 같습니다. 전체 코드 링크-<!DOCTYPEhtml><html><...

P粉809110129 2024-03-29 23:39:12 0  1  444

Vue 3의 v-for 루프에서 버튼의 활성 상태 전환

Vue3에서 보려는 카테고리를 선택할 수 있는 필터 헤더를 만들고 있으므로 스위치를 클릭하여 필터를 전환할 수 있으며, 다른 카테고리를 클릭하면 이전 활성 카테고리가 한 번만 선택 취소됩니다. 활성 카테고리가 없습니다. 토글 버튼(선택 취소하려면 다시 클릭)이 없고 v-for 루프를 사용하지 않는 jsfiddle과 같은 몇 가지 예를 찾았습니다. 나는 이것을 v-for 루프로 변환할 수 있다고 확신하지만 전환을 쉽게 수행하고 한 번에 하나의 활성 범주만 갖는 방법을 모릅니다. 이게 나야

P粉046878197 2023-08-27 09:44:54 0  1  474

요소에 스크롤 이벤트 리스너가 추가되었지만 scrollTop이 0이 아닌 경우에만 올바르게 이동합니다.

그래서 저는 완료/활성 작업이라는 두 개의 목록이 있는 작은 스크립트를 작성했습니다. 버튼을 클릭하면 작업 목록을 전환할 수 있고, "추가 정보"를 클릭하면 작업에 대한 자세한 내용을 읽을 수 있습니다. 더 많은 정보를 클릭하면 새 div 요소가 생성되고 해당 요소의 호스트 요소 Y 위치를 따르고 싶습니다. 절반만 작동합니다. 다음과 같습니다. 여기에 이미지 설명을 입력하세요. 이것은 버그입니다. 스크롤 가능한 요소인 scrollTop이 0이 아닐 때 이 오류가 발생한다고 확신합니다(올바른 방식으로 생성되었으며 스...

P粉427877676 2024-04-01 11:03:26 0  1  574