web

Firefox can not be open after you install it on MaC

After you download and install Firefox on your Mac you may see the error message, "Firefox.app" . What to do ?

EPM Registry Initialization Fails

The EPM Registry initialization fails in the BIDomain domain. Oracle Fusion General Ledger and Oracle Fusion Customer Relationship Management (CRM) code running within the FinancialsDomain and CRMDomain domains, respectively, has direct integration with the EPM Registry API and consumes EPM Security Component, which also tightly integrates with the EPM Registry API. When EPM Registry initialization fails, it greatly impacts communication with downstream EPM products in the BI domain.

Loading only one image and position it when hovering over it

It takes just a little modification in the images and the "hover"-methode.
First: the image that is shown by default and the 2nd image, that ist shown when hovering over the first, have to be combined to one image. Just put the 2nd image directly under the 1st via an image tool and save it as a new image. So this new image should be exactly twice the size of the original ones. Then use this new image in the "background"-attribute in your div. The "height" of the div must be exactly the half of the height of the new image. Furthermore you have to set the "background-position" in the div to "top". This way only the upper half of the image is shown. And finally you set the "background-position" in your "hover"-element to "bottom". So when hovering over the image it just gets "moved" to the top and only the bottom half can be seen.

In the attachment you can see what it would look like, when combining the 2 images.

Here is an example where the comined image is 100px wide and 60px high:

#button_home {
position:absolute;
width:100px;
height:30px;
background:url(home.png);
background-position:top;
}
#button_home:hover {
background-position:bottom;
}

This way everytime the page is loaded the combined image is loaded and there will be no delays.

Taggings:

Image with a text overlay that is dynamically generated

I want to display an image with a title that lays on top of the image. This title should be dynamically generated, therefore no photo editing tool can be used in this situation. The text comes from a dynamically generated JSON object, which then can be used by a JavaScript in order to inject the title information into a website. The only technologies that can here be used is web technologies such as XHTML and CSS.

examples of rich set JSF components

I need good examples of UI components I can integrate in a web application that uses JSF.

Embedding customized web fonts using CSS and @font-face

To ensure the best cross-browser support it is necessary to convert a font file (usually in OTF or TTF) to OTF, TTF, EOT, WOFF and SVG files. This can be done with e.g. Font2Web or Font Squirrel .

The next step is writing the CSS. In the example below the font Atype 1 is embedded. /fonts/Atype1.[extension] denotes the relative path to the file:
@font-face {
font-family: 'Atype1';
src: url('/fonts/Atype1.eot');
src: url('/fonts/Atype1.eot?#iefix') format('eot'),
url('/fonts/Atype1.svg') format('svg'),
url('/fonts/Atype1.woff') format('woff'),
url('/fonts/Atype1.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

Now the font can be used by referencing it:
h1 {
font-family: 'Atype1', Arial, sans-serif;
}

Creating a web audio player with GWT

Google Web Toolkit (GWT) is a set of tools that allows for creating JavaScript applications in Java. For a web application I was working on with GWT, I had to create an audiovisualization unit. For that purpose it was necessary to implement an audio player that would play/pause/resume/stop a sound file by request.

Effects for Web Pages

In the 1990s web pages were really boring because they offered only static content that did not interact with the user's actions. Nowadays, thanks to technologies like AJAX and Flash we have the possibility to enhance websites with stunning effects and interactivity. <strong>Challenge:</strong> <ul> <li>Find an easy way of adding stunning effects and interactivity to your web page.</li> </ul>

Using Piwik (open source web analytics)

Piwik is an Open Source alternative to Google Analytics.

  • You'll need access to web server (via shell or FTP) that supports at least PHP 5.1.3 an MySQL 4.1
  • Go to www.piwik.org and download the latest version of piwik (zip-file).
  • Unzip it and upload the files into a folder on your web server, e.g. yourserver.com/piwik
  • In your webbrowser, navigate to the URL you installed Piwik on.
  • Now you are guided through the installation process. Follow the instructions.
  • At the end of the installation process, Piwik will provide you a JavaScript code snippet which you will have to embed in the website you want to analyze. You can paste it into the body of footer-tag.

Taggings:

Change data sent using POST method of HTTP

The main HTTP methods used for sending data to the web server are GET and POST method. When using the <strong>GET method</strong>, the data is encoded directly in the requested URL, specifically to the query part of it. The query part starts with a question mark and consists of pairs key, value in a form <code>key=value</code>, the pairs are divided by an ampersand. For instance to inform the web server that a user wants to log off, quite often the URL of the form <code>index.php?action=logout</code> is used. Therefore it is very easy to change the sent data. The <strong>POST method</strong> uses the body of the HTTP message to store the data. The user has no direct possibility to change the data. We want to find an easy way to do so.

Pages

Subscribe to web