Replacing An Image On A Page

Dec 6, 2004

On certain pages, I display 10 pictures as thumbnails and one in the center to view as the main one. It works pretty nice but its not working for me in FF .. so I have to upgrade my coding methods here.

I have named the picture in question 'swap' in the html. The command that activates the swap is here:

onClick="MM_swapImage('swap','','listings_images/#URL.ID#/#display.img1#',1)"

Which runs this:

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

Now to note, that I am not doing a rollover here, just click and swap the image.

View 2 Replies


ADVERTISEMENT

Replacing The CSS Background Image

Jul 25, 2005

I need to remove this in the XHTML and replace it with a Javascript function that does the same thing. (<?=$bgImage?> is a random file name returned by PHP)

Code:
<style type="text/css">
html{
background-image:url(core/images/bg/<?=$bgImage?>);
}
</style>
The site uses a session var to rotate the bg only if its been 10 seconds (for testing, The final will be 1-2 mins, or i may disable the rotation and simply give the user a unique bg with every visit)

I'm not sure how to target the html elment in the CSS document to change the backgroundImage.

View 3 Replies View Related

JQuery :: OnClick Image Replacing Itself With Another?

Aug 3, 2009

just getting started with JQ so i hope you can help me out with it Idea is that the element is a rotation of four images changing on click.basic HTML behind it is

<li><a href="#" class="puzel"><img src="images/puzel1.jpg" /></a></li>
and JQ behind is currently like that
$(".puzel").click(function(){

[code]....

View 3 Replies View Related

Replacing Some Content In A Web Page

Jun 15, 2009

I need to replace some content in a web page with new content, without leaving the page.

When opening the following page, there are two rectangles, one being small and the one large: [url]

When clicking the small rectangle in above page, the two rectangles will be replaced by the two in following page: [url]

I understand that the two sets of rectangles may need to be coded in one page. I put them in two different ones in order to present my ideas clearly.

View 4 Replies View Related

Finding And Replacing Text In A Page?

Dec 5, 2010

I have this page created, And in the page is a news header, In the header it says %ss%. Can someone help me create code, so that in the footer of the page javascript finds this %ss% and replaces it with text from a webpage?Code:What the web page that needs inserting does:I have this game and it uses php fsockopen to determine if a port is open. If the port is in use the page displaysThe server is <font color="#0066FF"><b>Online!</b></font>Otherwise it's:The server is <font color="#FF0000"><b>Offline!</b></font>

View 6 Replies View Related

Firefox - Replacing The Whole Page By The New One In Ajax Response

Sep 24, 2006

We have the following situation - when Ajax request is sent what's
being returned by the server is usually an XML (which is used for DOM
updates) but sometimes it's HTML which is a whole new page that should
replace an existing one. I.e when we issue an Ajax request we don't
know what will be returned and analyze the response to act accordingly.

Now, the way to replace the current document with a new one used to be
easy and portable for both browsers (we're only supporting IE6 and
Firefox 1.5):

document.open();
document.write( head );
document.write( body );
document.close();

where "head" and "body" are two parts of the result HTML. We had to cut
it to two (rather than going simply with document.write( NewHTML ))
because of IE - our head section contains references to external
JavaScript files (<script type="text/javascript"
src="sth.js"></script>) and IE only loads them when document.write()
call ends. So if body contains any script block (<script
type="text/javascript".. </script>) using any of JS referenced by
head - IE would fail with something like "Resource undefined" if we
push the whole new HTMl in one go by using document.write( NewHTML ).
But it worked perfectly fine in Firefox, meaning

document.open();
document.write( NewHTML );
document.close();

did the job just fine. What's even more important - it also evaluated
all JavaScripts correctly - both in external files referenced by the
head and in the JS blocks embedded in the body.

Until Firefox 1.5.0.6/7 where things stopped working completely - our
lovely and used-to-be portable code

document.open();
document.write( head );
document.write( body );
document.close();

caused Firefox to loose all CSS/JS and display an HTML only page (as if
CSS/JS were disabled). Removing document.close(); improved the
situation a bit by displaying the page with CSS this time but still -
*no* JavaScript was evaluated (meaning, JavaScript blocks embedded in
the document's body were not evaluated).

I took a different path from this point by pushing the new content to
document's head and body "innerHTML". It worked but not for JS
evaluation - I had to do that manually. To evaluate the JS referenced
in the head section of the document - I've traversed the head's DOM
tree while looking for the "script" nodes, then downloaded all of them
one by one using a synchronous Ajax calls (don't laugh!) and eval()-ed
the response. To evaluate JS blocks embedded in the body of the
document - I've traversed the body's DOM tree while looking for the
"script" nodes and eval()-ed them.

The problem is following: eval()-ing external JS files after
downloading them with Ajax doesn't work in 100% of cases - some
statements using Prototype functions fail to execute ("prototype.js" is
one of external JS files referenced in the head). Anyway, I'm almost
sure that what I'm doing is plain wrong, i.e it's sounds silly to
download all JS files referenced in the head and eval() them !

So how do I fix it ? Simply put - how do I replce the content of the
document to the completely new one received as a response to
asynchronous Ajax call ? The new content conatins doctype, head, body -
it's a completely new page. And all JS referenced in the head and
embedded in the body should be evaluated as well.

I really wish

document.open();
document.write( head );
document.write( body );
document.close();

was working in Firefox as before. Is it simply a Firefox bug, should I
submit it ? Btw, document.open.write.write.close() works just fine in IE6.

View 4 Replies View Related

JQuery :: Replacing Repeating Text On A Page?

Mar 28, 2011

I have a SharePoint page that is filled with the text string "12:00 AM" that I would like to remove, the underlying HTML is

<td class="ms-cal-workitem">
<table>
<tr>
<td class="ms-cal-monthitem">

[Code]....

View 14 Replies View Related

Alternative To Document.write To Replace Image On Page - Click Event That Replaces An Image On Page With New Image

Aug 29, 2010

Im trying to have a click event that replaces an image on the page with a new image that has been selected randomly from an array. I have solved PART of this already (can get the random image to appear).

However, instead of appearing on the page where the old image was, the new image appears in a blank page.

My research indicates that this blank page location-problem is a result of using document.write in the Function. Therefore, I know I need to find a different way to accomplish this, but am failing miserably.

I have been trying for hours and hours and HOURS to figure out proper syntax for accomplishing this via elements, functions, variables and mootools.

A bit of my research:

-I found this---but havent figured out how to implement it in my scenario:

Source: [url]

-I found this---but havent figured out how to implement it in my scenario:

Code:

Source: [url]

View 4 Replies View Related

Setting An Image Width - Change An Image On A Page Without Reloading The Page

Jan 6, 2010

I'm using Javascript to change an image on a page without reloading the page. The problem is that my images are various widths (but identical heights), yet each image I change it to uses the width of the first image.

[Code]...

View 4 Replies View Related

JQuery :: Replacing DIV Content With Other DIV Content From Same Page?

Mar 18, 2010

I have content in hidden (invisible) DIV elements on a page that I want to load into another DIV element on same page. I need to replace content currently in a DIV with that coming from another DIV. DIV ontent could be a P element or a P and IMG element.

View 4 Replies View Related

Click Event That Replaces An Image On Page With A New Image That Has Been Selected Randomly From An Array

Aug 29, 2010

Im trying to have a click event that replaces an image on the page with a new image that has been selected randomly from an array. I have solved PART of this already (can get the random image to appear).

However, instead of appearing on the page where the old image was, the new image appears in a blank page.

My research indicates that thisblank page location-problem is a result of using document.write in the Function. Therefore, I know I need to find a different way to accomplish this, but am failing miserably.

I have been trying for hours and hours and HOURS to figure out proper syntax for accomplishing this via elements, functions, variables and mootools.

A bit of my research:

I found this---but havent figured out how to implement it in my scenario:

I found this---but havent figured out how to implement it in my scenario:

Code:

Source: [url]

View 1 Replies View Related

Image Insertion Page That Is Part Of A JS WYSIWYG - Put Caption Bar After The Image In The Main Code?

Nov 27, 2011

I have an image insertion page that is part of a JS WYSIWYG. It works okay, but I would like to add a styled caption bar underneath it.

This is what I'm currently using for the caption (inserted by a button):

Code:

This is the code from the insert image page:

Code:

How do I put the caption bar after the image in the main code?

View 1 Replies View Related

Mouseover Image Effect Thumbnail To Large Image Different Location On Page

Oct 27, 2009

I have gotten my script to do exactly what I want it to do with one exception. I have some thumbnail images that people can mouse over and the actual image is 100px by 75px. That is what I use for my thumbnail and they reside in www.website.com/images/thumbs/image1.jpg. I have the large version of the image that resides in www.website.com/images/image1.jpg. Its actual size is 640px by 480. When I mouse over my thumbnail, I don't want the thumbnail to appear for the larger image, I want the large image to appear instead? Let me know if you need ellaboration.

Javascript
<script language="JavaScript">
function Change_Big_One(thumb){
document.getElementById('BigOne').src=thumb.src.replace("_th","")

[Code].....

View 4 Replies View Related

Perform Images - Page HTML - Show 1 Image And After 5 Sec It Will Change The Other Image

Nov 9, 2010

I have a page HTML. In HTML have 1 button, when click into button that'll appear 1 window. In this window, it's show 1 image and after 5s it will change the other image. I can't do this.

View 5 Replies View Related

Image A Hyperlink To Specific Urls Rather Than The Image In Its Own Page In The Contenflow.js?

Apr 22, 2011

how to make the image a hyperlink to specific urls rather than the image in its own page in the contenflow.js? I've found that if you comment out this line: window.location.href=A You will successfully delete the hyperlinks that link to the full size image. However, I'd like to have a click on each image take you to individual specific pages. PS> I'm a designer not a javascript coder -- so detailed explanations are needed. Documentation: [URL]

View 3 Replies View Related

JQuery :: Make An Image Selection, Display Same Image On Page In Unique Id And Save To Hidden Input All In One Click?

May 11, 2010

Using a UI dialog I'd like to load in 10 or so images. Each would be unique and after you click on one the following needs to happen:

1. Image appears on the parent page in a specified ID.

2. A "hidden" field is updated so that when the user submits the db is updated with their selection.

3. Dialog closes automatically.

That's it. Basically it would work similar to "datepicker".I'm using the latest 1.4 and ui and been making great progress as learning basics. I need to do the above and it seems like such a no brainier and or it should already exist but after 2 days of searching and trial and error...

View 6 Replies View Related

Click On One Image To Change Another Image On The Same Page?

Jul 16, 2010

I have a page which is a large graphic sliced up into various pieces for better loading. It's a drawing of a bedroom and I need to have it set up so that when a user clicks on a link that is mapped to a frame hanging on the wall, it opens the doors of a cupboard. The photoframe and the cupboard are in different images.

I thought of using a Javascript image rollover but I can't see how that can be used to change a different image rather than the image that has the link in it.

I've done a little Javascript editing. Am happy to upload the code and images to the web if required.

View 3 Replies View Related

Loading Image : Page Is Not Redirect To Next Page?

Aug 21, 2011

i had a loading image that appears while i submit the form but the problem is that my page is not redirect to next page.here is my code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>[code]............

View 1 Replies View Related

Replacing Characters

Mar 6, 2006

I have a script which gathers information from a form and, if needed, writes this info to a 'preview' window. At times {tokens} are used in place of real html tags. How can I tell the script to look for "{" and "}" and replace them, respectively, with "<" and ">".

I tried using "str = str.replace(/{/g, "<").replace(/}/g, ">");" but that didn't work. The script in question is being written by PHP... thus, may be generating a syntax-based failure. Any ideas?

View 14 Replies View Related

Replacing A Table?

Aug 28, 2006

Is it possible to delete a table and put another one in it's place, in the same document?

View 2 Replies View Related

Replacing The Src Of An Img After Loading

Jul 25, 2004

What I want, is the code to look for a particular ID of an img, and then change the filename (but not the whole path) of the image.

For instance...
if the path was "../images/headin.gif", the javascript would find this by the ID, and change to "headin" to "headdown".

I know I can do something like...
if(a.getAttribute("img").indexOf("headin")) {

but then I need to know how to replace "headin" with "headdown".

How can this be done?

(the reason I don't want to replace the whole src, as that would be very simple, is that the path of the image will change depending on the directory the page is in)

View 2 Replies View Related

Replacing Data With DOM

Jul 25, 2005

I'm trying to get my head around DOM and it's usefulness in designing web applications. Some of it is pretty straight forward, while some is kind of vague. What I am trying to do now is write data to a page. I want to fill in the data in the second span below.

<div>  <span>Size</span> <span class="size"></span>  </div>

I can write the data using the following.

var posSize = document.createTextNode(&#398;');  parent.document.getElementById('size').appendChild(posSize);

But as the name suggests, it appends it to the current value. So every time I click something on the page and the value needs to reflect that item, it just appends it to the former value.

View 13 Replies View Related

How To Append Instead Of Replacing

Jan 29, 2007

I got a javascript code that displays new text boxes when someone clicks on a button. Here is the code that goes into the header:

<script type="text/javascript">
boxct=0;
function dispMoreFiles() {
var upbox = "<INPUT name='numbers[]' TYPE='text' size=&#3930;'><br>";
var updiv = document.getElementById("morefiles");
if (boxct<9) {
var addhtml = updiv.innerHTML+upbox;
updiv.innerHTML = addhtml;
boxct++;
} else {
alert('Message');
}}

</script>
I use this simple code in the body to make use of it:

<input type="text" name="numbers[]" size="30">
<div id="morefiles">

<input name="add" type="button" value="Click To Add Another Box">

Now, if I add another box, then type some text into it, then add another box, the box I just typed into is replaced with a new box, and a new box is added. How do I just make it add a new text box instead of replacing a current one?

View 14 Replies View Related

Help For Text Replacing

Apr 19, 2002

I have a pitures folder with this format :

name_setnumber_picnumber.jpg

for ex: foo_1_02.jpg

how to write a function in JS to return the next and prev image names of the given name of the first image. ( foo_1_01.jpg and foo_1_03.jpg ).

View 4 Replies View Related

Replacing A Varying Substring With Itself Plus

Jul 23, 2005

I'd like to globally replace a substring specified by a regular
expression with itself along with some additional characters.
example:

var oldString = 'asdf BRACKETTHISasdfsdf sd asdBRACKETTHISasdf asd'

var newString =
oldString.replace(/sw*BRACKETTHISw*/g, '<' + ?some expression that
accesses current match? + '>' )

And newString winds up as:
'asdf <BRACKETTHISasdfsdf> sd <asdBRACKETTHISasdf>
asd'

Is there a way to do this, or do I have to use other methods?

View 1 Replies View Related

Replacing Href Text

Jan 26, 2006

I have a page that contains several HREFs. Each HREF that I'm interested in has a common parameter (parmX). Does anyone have a script example on how to find-and-replace parmX with parmY?

I'm assuming that I'd need to do this in the onload event - but I don't know much about Javascript.

View 8 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved