separate desktop component to imagesDesktop

This commit is contained in:
Spedon
2023-05-04 12:33:01 +08:00
parent dd942979b8
commit c610f01d51
2 changed files with 20 additions and 4 deletions

View File

@@ -1,4 +1,4 @@
.images { .imagesDesktop {
img { img {
position: absolute; position: absolute;

View File

@@ -6,6 +6,8 @@ export let overlayCursor: HTMLDivElement
export let cursorInnerContent: HTMLDivElement export let cursorInnerContent: HTMLDivElement
export let imagesDivNodes: NodeListOf<HTMLImageElement> export let imagesDivNodes: NodeListOf<HTMLImageElement>
const mainDiv = document.getElementById('main') as HTMLDivElement
const passDesktopElements = (): void => { const passDesktopElements = (): void => {
overlayCursor = document overlayCursor = document
.getElementsByClassName('overlay_cursor') .getElementsByClassName('overlay_cursor')
@@ -13,7 +15,12 @@ const passDesktopElements = (): void => {
cursorInnerContent = document cursorInnerContent = document
.getElementsByClassName('cursor_innerText') .getElementsByClassName('cursor_innerText')
.item(0) as HTMLDivElement .item(0) as HTMLDivElement
imagesDivNodes = document.getElementsByClassName('images')[0] imagesDivNodes = document.getElementsByClassName('imagesDesktop')[0]
.childNodes as NodeListOf<HTMLImageElement>
}
const passMobileElements = (): void => {
imagesDivNodes = document.getElementsByClassName('imagesMobile')[0]
.childNodes as NodeListOf<HTMLImageElement> .childNodes as NodeListOf<HTMLImageElement>
} }
@@ -27,13 +34,22 @@ const createCursorDiv = (): HTMLDivElement => {
} }
export const createDesktopElements = (): void => { export const createDesktopElements = (): void => {
const mainDiv = document.getElementById('main') as HTMLDivElement
mainDiv.appendChild(createCursorDiv()) mainDiv.appendChild(createCursorDiv())
const imagesDiv: HTMLDivElement = document.createElement('div') const imagesDiv: HTMLDivElement = document.createElement('div')
imagesDiv.className = 'images' imagesDiv.className = 'imagesDesktop'
for (let i = 0; i < imagesArrayLen; i++) { for (let i = 0; i < imagesArrayLen; i++) {
imagesDiv.appendChild(createImgElement(imagesArray[i])) imagesDiv.appendChild(createImgElement(imagesArray[i]))
} }
mainDiv.appendChild(imagesDiv) mainDiv.appendChild(imagesDiv)
passDesktopElements() passDesktopElements()
} }
export const createMobileElements = (): void => {
const imagesDiv: HTMLDivElement = document.createElement('div')
imagesDiv.className = 'imagesMobile'
for (let i = 0; i < imagesArrayLen; i++) {
imagesDiv.appendChild(createImgElement(imagesArray[i]))
}
mainDiv.appendChild(imagesDiv)
passMobileElements()
}