简体   繁体   中英

ASP.Net 4.0 URL Routing block javascript from running

I have article details page where i display article details like article image, date and article text. On the left side of the article i put a vertical blue line which is equal to the height of the article body, since i am not sure of the article height i use javascript to get the height of the article text container and assign that same height to the vertical blue bar (div id='ArticleBlueSide') which is 3 pixels in width.

It was working fine & blue line was also showing up without URL Routing, but when i add URL routing Blue line doesn't show up.

Below is the block of script and my HTML div contains.

I am working with ASP.Net 4.0 web form using c#.

I would appreciate if some can help me to fix this design issue.

$(document).ready(function () {
    var h = document.getElementById("ArticleTextArea").offsetHeight;
    h = h - 25;
    document.getElementById("ArticleBlueSide").style.height = h + "px";
});


<div id="ArticleContainer">
     <div id="ArticleBlueSide"></div>
     <div id="ArticleTextArea">
          <asp:Label ID="lblArticleDetails" CssClass="PageBodyText" runat="server"  meta:resourcekey="lblArticleDetailsResource1"></asp:Label>
     </div>
</div>

Example of page illustration 例

After Implementing Solution suggested by riffnl (This has its own issue as blue line is longer than text and i cant fix it as paragraphs have padding around it. My first solution worked fine except it is not working after URL routing

解决后的例子

@riffnl's solution is the way to go - solve your padding issue like so: http://jsfiddle.net/Wf6tA/

Notice that you can click a paragraph to mark or unmark it.

I moved the following script and put it after the div tag which solved my problem. I dont understand why it is not working if i keep this script before div tags.

$(document).ready(function () {
    var h = document.getElementById("ArticleTextArea").offsetHeight;
    h = h - 25;
    document.getElementById("ArticleBlueSide").style.height = h + "px";
});

I appreciate reply from other guys but this is the what i wanted script to behave.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM