Okay, i am creating a code library for myself and i am wondering how does one display java code on an html page? I asked my teacher how to do it and he said he has never done it before and the students told me that is an interesting question.

So, does anyone have any resources on how this is done or how daniweb does it?

Recommended Answers

All 10 Replies

Java or Javascript? Do you mean to preserve formatting space? If you want to display it nicely, there's javascript code to help you display code. One is called syntax highlighter.

One approach is to simply place your content within <pre> tags. If you want to display HTML use &lt; for "<" and so on.

Are you asking of displaying java code or using java code in your HTML.
If it is just the display then you can add it in <pre> tag as suggested by JorgeM.
But if you mean like using JAVA objects,methods,variables in html you can use JSTL(JavaServer Pages Standard Tag Library) tags or JSP(Java Server Pages).

I was asking about how to display java code (you know, if it were like a tutorial) on an html document.

I am using a syntax highlighter and my code doesn't seem very compatible with the syntax highlighter. I am displaying the java code in a pop up and this is my code and it doesn't seem to work.

CSS:

    .popover {
    padding: 20px;
    background-color: #FCFCFC;
    position: absolute;
    display: none;
    border-color: #ff6600;
    border-style: solid;
    border-width: 1px;
    height: 300px;
    width: 400px;
    z-index: 2;
    }
    body {
    font-size: 13px;
    font-family: "Lucida Grande", Verdana, Arial, sans-serif;
    }
    .transBG {
    left: 0px;
    top: 0px;
    position: absolute;
    display: none;
    background-color: black;
    z-index: 1;
    opacity: .85;
    filter: alpha(opacity=85);
    }

Do you guys know what would cause the errors when i use the above css?

Here is the html:

        <div align="center">
        <a href="javascript:showPopOver('pop1');">Click Here</a>
        </div>
        <div id="pop1" class="popover" align="center">
            <pre class="brush js;">
            Placement for code! This doesn't display nicely either.
            </pre>
                <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
        <a href="javascript:closePopOver('pop1');">[EXIT WINDOW]</a>
        </div>       

I don't think the jquery is needed (there isn't a problem with it, just with the css).

first of all i will say there is difference between java and javascript

How is JavaScript different from Java?
The JavaScript programming language, developed by Netscape, Inc., is not part of the Java platform.
JavaScript, does not create applets or stand-alone applications. In its most common form today, JavaScript resides inside HTML documents, and can provide levels of interactivity to web pages that are not achievable with simple HTML.

Listed are key differences between the Java and JavaScript.
Java is an OOP programming language while Java Script is an OOP scripting language.
Java creates applications that run in a virtual machine or browser while JavaScript code is run on a browser only.
Java code needs to be compiled while JavaScript code are all in text.
They require different plug-ins.

from http://www.java.com/en/download/faq/java_javascript.xml

I understand that but what syntax highlighter would i need in order to put java on the html page without executing...?

<M/> if i am not wrong you are asking why your popup is not shown in correct format.
Do one thing remove <pre> tag then it will work a expected.Also if your text is long then you can use **word-wrap:break-word; **in popup style property.

I am still confused why are you referring to java?You want to just display java code or execute java code .

Removing the <pre> tags didn't do anything other than displaying them as regular text.

I am still confused why are you referring to java?You want to just display java code or execute java code .

I am trying to display java code on a html page, not execute it.

ok now i understood...just add overflow:auto css property to show scroll if popup content(java code) is greater than popup size

<script src="popover.js" type="text/javascript"></script>
<style type="text/css">
.popover {
    padding: 10px;
    background-color: #FCFCFC;
    position: absolute;
    display: none;
    border-color: #ff6600;
    border-style: solid;
    border-width: 1px;
    height: 400px;
    width: 400px;
    z-index: 2;

    overflow:auto;//add this to show scroll if content is greater than popup size
    }
    body {
    font-size: 13px;
    font-family: "Lucida Grande", Verdana, Arial, sans-serif;
    }
    .transBG {
    left: 0px;
    top: 0px;
    position: absolute;
    display: none;
    background-color: black;
    z-index: 1;
    opacity: .85;
    filter: alpha(opacity=85);
    }
    <!-- css for inside text -->

</style>
<div align="center">
        <a href="javascript:showPopOver('pop1');">Click Here</a>
        </div>

        <div id="pop1" class="popover" align="center">
         <pre >  
     //your code here
            </pre>

        <a href="javascript:closePopOver('pop1');">[EXIT WINDOW]</a>
        </div>       

hmmm... the overflow auto didn't do anything to format it properly (no numbers or proper alignment).

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.