PDA

View Full Version : iFrame button replace



rysmith
11-09-2006, 10:38 PM
1) Script Title: iFrame Button Replace

2) Script URL (on DD):http://www.dynamicdrive.com/dynamicindex17/randomiframe.htm

3) Describe problem: How can I replace the default button with my own design?

jscheuer1
11-10-2006, 06:48 AM
What button?

rysmith
11-10-2006, 06:01 PM
The "Ping" button that appears when a new random page is selected.

Here is an example: http://www.kabubble.com/pingxit_news.htm

Ry

jscheuer1
11-10-2006, 07:19 PM
That button has nothing really to do with the script. Here is the code for that button on that page:


<input type="button" value=" PING " onclick="window.location.reload()" style="color: #2E3192; font-weight: bold; font-family: Verdana; font-size:12pt">

The:


value=" PING "

is the text displayed, the style can be whatever style you like and, as you can see, all it does when you click on it is reload the page. When this happens, most browsers will also rerun any scripts on the page.

rysmith
11-10-2006, 07:32 PM
I see but what I want to do is to substitute a button image - .gif or jpeg. Not sure how to do this...

jscheuer1
11-10-2006, 07:51 PM
It depends upon if you want an image button:


<input type="image" src="mybut.gif" onclick="window.location.reload();">

or an image as a link:


<a href="#" onclick="window.location.reload();return false;"><img src="mybut.gif" border="0"></a>

rysmith
11-11-2006, 03:28 PM
Thanks John, your button solution worked. Since you know this coding, do you have an answer to my previously posted question:

"Is there a way to access the URL of the (randomly) selected page? For example, click a button and the URL of the displayed page is accessed."

Thanks, Ry

jscheuer1
11-11-2006, 07:14 PM
If I understand correctly, sure:


<input type="image" src="mybut_2.gif" onclick="window.location.href=document.all? document.all.dynstuff.src : document.getElementById('dynstuff').src;">

By the way, this script is not rated for Opera but, it works fine in that browser if you let it by changing this:


var ie=document.all&&navigator.userAgent.indexOf("Opera")==-1
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1to:


var ie=document.all
var dom=document.getElementById

userkef1992
11-11-2006, 07:20 PM
does someone now how to change the borders in the iframe?

jscheuer1
11-11-2006, 07:30 PM
does someone now how to change the borders in the iframe?

I think you mean the border of the iframe. Do you? If so, you can specify the standard iframe border simply by using the script as is. If you wish no borders, change the frameborder attribute below to 0:


//Specify IFRAME display attributes
var iframeprops='width=130 height=130 marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="1" scrolling="no"'

For a custom styled border, use 0 in the above and put this style section in the head of the page:


<style type="text/css">
#dynstuff {
border:1px solid red;
}
</style>

You can use any valid border styling you like in it.

rysmith
11-11-2006, 10:23 PM
John,

Unfortunately, this doesn't work the way I'd like - it simply opens up the displayed page and takes over the entire screen.

Now that I look at the button idea, I'd rather have the actual URL of the displayed page appear at the bottom of each page. That way the user can select and send to a friend, or save to Favorites.

Review this page for example: http://www.kabubble.com/pingxit_test1.htm

rysmith
11-11-2006, 10:38 PM
John,

Unfortunately, this doesn't work the way I'd like - it simply opens up the displayed page and takes over the entire screen.

Now that I look at the button idea, I'd rather have the actual URL of the displayed page appear at the bottom of each page. That way the user can select and send to a friend, or save to Favorites.

Review this page for example: http://www.kabubble.com/pingxit_test1.htm

userkef1992
11-12-2006, 03:08 PM
thanks for solution, if found them rather ugly (the standard borders)

userkef1992
11-12-2006, 03:24 PM
can the border styling be combined with another css? b'cause i tried it on nvu (with another css) showed nothing

jscheuer1
11-13-2006, 06:35 AM
userkef1992 - All css style may be 'combined' or even written inline with its element. CSS means cascading style sheet. The styles cascade. This means that one style can be contradicted and thereby overridden by a later style on the page. Certain selectors though will persist even if apparently contradicted. Generally, the more specific and nested a selector is, the more precedence it will take. Other than that, if your syntax is correct, all styles may be combined.

Did you make sure to first set the attribute:

frameborder="0"

in the iframeprops section of the script? This only matters in IE as far as I know but, most people use that. The demo I am linking to below uses the exact style I posted earlier as regards this.

rysmith - I've been working on an update to the script that you might like. It has some nice features. It can now reload the iframe without reloading the page and if the loaded content is from the same domain and has a title, it will change a link on the page to that title and href. Opening in a new window might be to your liking for these links and/or buttons, easy enough to do. Here's a demo, not pretty but - the final layout is up to you:

http://home.comcast.net/~jscheuer1/side/random_iframe.htm

rysmith
11-13-2006, 04:21 PM
John,

This looks encouraging. I'll look forward to reviewing the final version.

Here is a summary of what I'd like to add to the "Pingxit" site:
1. A way to select the page URL and a) Email to a friend or b) Save to Favorites. Currently, I can't find the URL of the viewed page.
2. I would like to be able to back up. Currently, the back arrow just reloads a new page.
3. Code to prevent re-selection of previously selected page for (5) cycles.
4. Solve problem of some sites that that won't load in the table - they take over the entire page. Examples are NY Times and NPR (previously mentioned).

I'd appreciate any input you can provide on these problems.

Thanks, Ry

rysmith
11-13-2006, 04:38 PM
Here is the latest model of the site: http://www.kabubble.com/pingxit.htm

userkef1992
11-14-2006, 06:24 PM
[QUOTE=mr proffesur[/QUOTE]

tnx for help (i think so) didnt remermbered your name:) sorry for the bad name