I wanted to code a little HTA file which looks in a specific folder if there are any jpg files and, if yes, it displays them. For that I used VBScript. Everything works fine so far. In a second step I wanted to add the possiblity to click on an image to enlarge/zoom it while using Java and/or CSS.
And here is the problem. I only get the HTA+VB Script working but not the CSS. When I add/remove the 16th line (<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">) I can get the CSS working but not the VBScript any more.
Why is this and how can I work with this?
I am forced to HTA and can not use PHP or similar.
But as soon as I want to add CSS or HTML stuff to my code, e.g. something like document.GetElementsByClass etc., it's not working any more. I add the line <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> it works, but VBScript stops working.
My Code is the following:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<HTA:APPLICATION
Id = "objHTA"
ApplicationName = "Test"
Scroll = "no"
SINGLEINSTANCE = "yes"
Icon = "Test.ico"
WindowState = "maximize"
>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<style>
div.beispiel1 img{
transition: transform 0.2s;
}
div.beispiel1 img:hover {
transform: scale(2.0, 2.0);
}
div.scroll-container {
background-color: #000000;
overflow: auto;
white-space: nowrap;
padding: 0px;
height: 316px;
}
div.scroll-container img {
padding: 0px;
}
</style>
</head>
<body>
<div class="scroll-container">
<script type="text/vbscript">
Dim FolderPath
Dim objFSO
Dim objFolder
Dim colFiles
Dim objFile
FolderPath = "test\"
Set objFSO = CreateObject("Scripting.FileSystemObject")
Set objFolder = objFSO.GetFolder(FolderPath)
Set colFiles = objFolder.Files
For Each objFile In objFolder.Files
If LCase(objFSO.GetExtensionName(objFile.Name)) = "jpg" Then
document.write "<img src='" & FolderPath & "\" & objFile.Name & "' width=384 height=216'>"
End If
Next
</script>
</div>
<div class="beispiel1">
<img src="test.jpg">
</div>
</body>
</html>