CODEWITHSUNDEEP
javascripthtmlcss
Mahi
Mahi

Reputation: 593

How to remove aria-hidden = true and change it to false using javascript

the application uses integrated application for image upload and hence the exact html is not available in my application. I have an issue during image upload. The uploaded image is not showing in the actual mobile devices. But when i tested in the desktop browser using mobile mode the uploaded image is showing.

The html tag taken from the browser (F12)developer tools for the image section is below.

<span class="CaptureViewer-imageWrapper">    
    <div class="EnlargedPreview-container">
        <div tabindex="-1" aria-label="Photo of your document" aria-live="off" aria-expanded="false" role="img"></div>
        <button aria-labelledby="preview-button-label" class="EnlargedPreview-button EnlargedPreview-button-overlay">
            <span id="preview-button-label" class="EnlargedPreview-button-text">Enlarge image</span>
        </button>
    </div>
    <img class="CaptureViewer-image" src="data:image/jpeg;base64,/9j/4AAQSkZJRgA" alt="Photo of your document" aria-hidden="true">
</span>

The css for CaptureViewer-image class is below.

CaptureViewer-image {
    max-width: 100%;
    max-height: 100%;
    display: block;
    border-radius: .1875em;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-align-self: stretch;
    align-self: stretch;
    object-fit: contain;
    background-size: cover;
}

I am trying whether the aria-hidden in the image tag is set to false will fix the issue. Kindly provide your inputs how to change using javascript and kindly advise if any changes to fix the issue.

I am trying to find the solution and learn in the process.

Upvotes: 0

Views: 2362

Answers (1)

Matteo Maestri
Matteo Maestri

Reputation: 61

From Javascript you can get the img element with document.querySelector and then you can set the value of an attribute of your element with setAttribute

 document.querySelector('.CaptureViewer-image').setAttribute('aria-hidden', 'false');

Upvotes: 1

Related Questions