I'm looking to incorporate the
background:rgba(226, 93, 141, 0.76)body:after psuedo-element once my page has finished loading.
Below is my HTML and CSS code:
<style runat="server" id="myStyle" >
body:after{
position:fixed;
content:"";
top:0;
left:0;
right:0;
bottom:0;
z-index:-1;
}
</style>
Is there a way for me to target the body:after element during the page load event?
Add a fresh class called 'active' and include it in the body element.
body:after{
position:fixed;
content:"";
top:0;
left:0;
right:0;
bottom:0;
z-index:-1;
}
body.active:after{
background:rgba(112, 201, 45, 0.89);
}
Next, implement jQuery following Faiz Ahmed's advice:
$(window).load(function() {
$('body').addClass('active');
});
The issue has been resolved:
protected void Load_Page(object sender, EventArgs e)
{
setStyle.InnerHtml = " body:after{
position:fixed;
content:'';
top:0;
left:0;
right:0;
bottom:0;
z-index:-1;
background:rgba(226, 93, 141, 0.76)";
}
<style runat="server" id="setStyle" >
</style>
Hey there, I'm looking to implement a slider functionality under my canvas that would allow users to change the brush size. Unfortunately, all my attempts so far have been unsuccessful. Can anyone lend a hand? Much appreciated! <canvas i ...
Multiple posts have emphasized the importance of using an ID only once. But, I'm facing a situation where I need to pass 2 PHP variables to my JavaScript. I initially thought of using document.getElementById, but since IDs must be unique, this approa ...
Is there a method to trigger a unique function every time a user scrolls to a different div or section of the page? ...
My latest project involves dynamically changing the CSS styles of each individual character in a given text input. For example, if the user types "Stack" into the input field, I want the 'S' to appear in red, 't' in blue, 'a' ...
Is it possible to have a drop-down list with an input textbox field for creating new items in the same dropdown menu? ...
I have a button labeled "MENU" at the top and a logo image below it. Currently, the menu expands from the bottom of the button. I would like it to expand from the top instead, and when the menu is expanded, the button should be under the navigation list, n ...
Greetings! I have been attempting to achieve horizontal sorting for two divs but have encountered a couple of issues. Firstly, the divs do not align correctly upon initial page load and secondly, while they can be dragged around, the sortable functionality ...
My goal is to make a row editable when a button is clicked. $(":button").click(function(){ var tdvar=$(this).parent('tr').find('td'); $.each(tdvar,function(){ $(this).prop('contenteditable',true); }); }); <s ...
Looking to dive into the world of css3 design and wondering how to achieve a box-shadow inset with a touch of transparency. Check out the example in this fiddle link: http://jsfiddle.net/TeGkt/4/ Any ideas on how to replicate this effect without relying ...
Currently, I am working with Redux and ReactJS to develop a discussion platform. One of the key features I am trying to implement is where users can input the title and content of their post, which will then be submitted to create a new post. After submit ...
Having an issue with Webpack where it's generating duplicate images, one of which is broken. I have an original image image, and after running Webpack, two duplicates are created. One works fine: image, but the other one is broken: image. I'm us ...
My flexbox layout is set up as shown in the code snippet below: html { height:100%; width:100%; } body { display:flex; flex-direction:column; align-items:stretch; height:100%; width:100%; margin:0; background-color:grey; } header { b ...
Struggling to create a layout for a website, here is the CSS and HTML I am using. Issue: 1. The header and navigation divs seem to be merging even without using margin 2. The merge is not happening between the navigation and left-nav/content divs Can an ...
Hey guys, I'm currently attempting to set up a basic HTML post method using Ajax. Take a look at the code snippet below: <?PHP function fetchInstagramData($url) { $ch = curl_init(); curl_setopt_array($ch, array( CURLOPT_URL => ...
Here is the jumbotron configuration I am working with: https://i.stack.imgur.com/JQGpA.png This jumbotron was generated using the following code: <div class="col-sm-2"> <div class="jumbotron jumbotron-fluid top-space"> <div ...
I've created a simple submenu using CSS, structured as an unordered list. It appears on hover by changing the display property to "block". <ul> <li><a href="#">item</a></li> <li><a href="#">item</a ...
There is a problem with fetching files in different formats. Specifically, I want to retrieve an HTML file that needs to be embedded in an iFrame. Currently, my AJAX request only retrieves SWF files. Is there a way to call and fetch the HTML file instead ...
I need help with adjusting wave SVG's on my website to fill the entire viewport or screen width. Does anyone have any suggestions? To create the waves, I used a Wave SVG generator and placed them within a div element. <nav> <div> //align ...
var btn = document.querySelector('.add'); var remove = document.querySelector('.draggable'); function dragStart(e) { this.style.opacity = '0.4'; dragSrcEl = this; ...
Below is the table content: <table> <tr> <td>"James"</td> <td>"do"</td> <td>"you</td> <td>"like</td> <td>"your life"</td> </tr> </table> <butt ...