|
JavaScript - Slideshow With Lightbox Feature
Hi everyone,
I currently have a slideshow working on my client's site, but I can't get lightbox to work properly on it. [bobbivanstudio.com/work.php] Is there a way to fix the existing slideshow to work with lightbox? Or is there another way of doing this (keeping the same look that is currently in place)? Thanks in advance! Similar TutorialsHi there, I have a slideshow that gathers images from a database. I've been trying to set it up to where it extracts the IMG SRC accordingly so when I click on the image, the lightbox shows the corresponding image. But no luck thus far. Here's what I mean: Code: <SCRIPT TYPE="text/javascript">
<!--
SLIDES = new slideshow("SLIDES");
<?php do { ?>
s = new slide();
s.src = '<?php echo $row_paintings['painting']; ?>';
s.text = '<b><?php echo $row_paintings['title']; ?></b><br /><span style="font-size:10px;"><?php echo $row_paintings['material']; ?><br /><?php echo $row_paintings['size']; ?><br /><?php echo $row_paintings['date_created']; ?></span>';
SLIDES.add_slide(s);
<?php
} while ($row_paintings = mysql_fetch_assoc($paintings)); ?>
//-->
</script>
How can I extract the current "s.src" parameter and use it on the "img src" tag to display the image accordingly? Any help would be much appreciated. Thanks! Hey all, I'm trying to add rel="lightbox" somewhere in the slideshow I have on my client's site slideshow [www.bobbovanstudio.com/work.php] but anything I try is unsuccessful. Slideshow javascript piece for the picture's link: Code: this.hotlink = function() {
// This method jumps to the slide's link.
// If a window was specified for the slide, then it opens a new window.
var mywindow;
// If this slide does not have a link, do nothing
if (!this.link) return;
// Open the link in a separate window?
if (this.target) {
// If window attributes are specified,
// use them to open the new window
if (this.attr) {
mywindow = window.open(this.link, this.target, this.attr);
} else {
// If window attributes are not specified, do not use them
// (this will copy the attributes from the originating window)
mywindow = window.open(this.link, this.target);
}
// Pop the window to the front
if (mywindow && mywindow.focus) mywindow.focus();
} else {
// Open the link in the current window
location.href = this.link;
}
}
}
Hyperlink on slideshow for picture link Code: <a HREF="javascript:SLIDES.hotlink()" rel="lightbox"><IMG NAME="SLIDESIMG" SRC="#" BORDER="0" ALT="slideshow image" STYLE="height:300px;filter:progid:DXImageTransform.Microsoft.Fade()"></a> Any ideas on how to fix this? Thanks in advance! Hi all, I want to find a Javascript if possible that emmulates the fuctionality shown under Editor's choice on either of these sites. http://www.irishtimes.com www.cnn.com I won't be using video but I would like the user to be able to click on a Left or Right arrow and upon doing this a new batch of Images with associated URL links will slide in. Problem I have is that I do not know what I should search for. Have tried keywords such as "Image Link Scroller", "Slideshow" but have not found a script that does something like what is on these websites. Any ideas? Hey all - trying to find a good rotating box with SEO content. Like this one, do you know what they are using or how I can accomplish this with something similar? http://www.studioscentral.com/ Thanks in advance I forgot to append what key is actually pressed too, but not sure how? Any quick help would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang=en>
<head>
<title>Question 5</title>
</head>
<body>
<form>
Char: <input type="text" id="catch"/> <br /><br />
Keycode: <br /><textarea id="display"></textarea>
</form>
<script type="text/javascript">
var ip=document.getElementById("catch")
ip.onkeypress=function(a)
{
var a=window.event || a
var uc=a.charCode || a.keyCode
document.getElementById("display").value=uc
}
</script>
</body>
</html>
Hi, I have been developing a show/hide feature on my companies web site for some time. I have so much code as to where I am confused when I need to add another slide function. I have provided the URL below to the page where the code exists. http://www.pjm.com/markets-and-opera...assistant.aspx This is where I get lost with the huge amount of code that I have. If you take a look under the second slider named "Electricity Markets" there is another slider underneath named "Energy Market". I need to add three more sliders right underneath in the same format under "Energy Market" If anyone can assists with this that would be great. I should have organized the code a lot better, so now I get lost within the code now. BTW, the show/hide feature really does not display well in Firefox, please try in IE. Thanks! I am trying to create a comments posting feature in my site using javascript However everytime i click on submit it shows the comment posted for a second and then the comment dissapears. It does not retain the comment posted. Please help. code is given below: Code:
<html>
<head>
<script type="text/javascript">
function post(){
document.getElementById("label").innerHTML=document.hello.posted.value;
}
</script>
</head>
<body>
<form name="hello">
<div id="label"> </div>
<textarea name="posted"> </textarea>
<input type="submit" value="Submit" onclick="post()">
</form>
</body>
</html>
Hello, http://www.phoenixdigitalweb.com/Con...urecommercial/ The main image is actually 1087 pixels wide. I want all the photos to appear 1087 pixels wide, but there is some code that is resizing the images. Can someone please take a look for me? Let me know if any code is needed. Thanks!! Several of the iPhone features can be duplicated with Javascript. One such feature I'd like to see is the Bookmark feature. You click on the Bookmark or Favorite button and the page name (of the html page) is saved to a list, just like what you see in modern browsers. Clicking on the list row brings up the bookmarked page. However, the app is not a browser, but made up of html/css/js pages that function from within a /www/ folder of the app. I've searched for such a script online, but the only ones I see are for desktop browsers (they permit a visitor to click on a link to place the page in the Bookmarks tab or folder of the browser). Does anyone know of a script that'll work on html pages in the iPhone and Android devices? Thanks! Steve The DOD has a method of letting you know how much BAH you are entitled to based on your zip code and pay grade. They have a "tool" that tells you what you get.... how do i get that "tool" on my site so i can stop linking people off my site? the feature i want is on https://www.defensetravel.dod.mil/site/bahCalc.cfm my BAH page is on: http://www.bootcamp4me.com/basic-all...r-housing-bah/ I dont even know how to get this tool on my site... any ideas on how to do this for my wordpress site? Hello JavaScripters! I was hoping you could help me with an application I'm working on using C# and the .NET Framework that incorporates Javascript. I'm trying to do something similar to to the FireBug / Firefox Inspect Element featu I came across http://www.selectorgadget.com/ which is exactly what I'm trying to do. It's in Javascript and after looking through the source code for the past 2 hours I still don't have a clue how to incorporate it into my program... From what I can tell it uses tokenizing and recursive analysis of DOM elements to figure out CSS selector paths: http://www.selectorgadget.com/stable/lib/dom.js. Here is what I have so far. The javascript code highlights HTML elements such as a <table> tag and changes the border and background color. Code: document.onmouseover = dohighlight;
document.onmouseout = dohighlightoff;
var BGCOLOR = "#444444";
var BORDERCOLOR = "#FF0000";
// Highlight <table> in grey
function dohighlight()
{
var elem = window.event.srcElement;
while (elem!=null && elem.tagName!="TABLE")
elem = elem.parentElement;
if (elem==null) return;
if (elem.border==0)
{
elem.border = 1;
// store current values in custom tag attributes
//
elem.oldcolor = elem.style.backgroundColor; // store backgroundcolor
elem.style.backgroundColor = BGCOLOR; // new background color
elem.oldbordercolor = elem.style.borderColor; // same with bordercolor
elem.style.borderColor = BORDERCOLOR;
var rng = document.body.createTextRange();
rng.moveToElementText(elem);
// Make a red border around <table>
function dohighlightoff()
{
var elem = window.event.srcElement;
while (elem!=null && elem.tagName!="TABLE")
elem = elem.parentElement;
if (elem==null) return;
if (elem.border==1)
{
elem.border = 0;
// recover values from custom tag attribute values
elem.style.backgroundColor = elem.oldcolor;
elem.style.borderColor = elem.oldbordercolor;
}
}
Any ideas on how to incorporate the Selectorgadget into my program would be greatly appreciated! Selectorgadget Source Code: https://github.com/iterationlabs/selectorgadget Hello, well i am having this annoying issue from previous 3 months and its a very long story to tell but i will try to make it small, well i am interested in using a popup to show flash games in it, so i did then my interest went to make all games playable in full screen so i did that too and got success, but i am facing issues due to wmode, if you visit my this site link http://www.bloghuts.com/2010/11/13-days-in-hell.html and click on play game for other browsers while using google chrome browser, you will see the error there will be blocks appearing in the game, while if click on play for google chrome then this error is not there, its just because of WMODE, for google chrome button i am using wmode while for all other browsers i am not doing this. the reason for not using wmode to my other browser play button is that if i add wmode to the games then the performance of the game is highly damaged in fireforx and internet explorer, and also to some extent in other browsers including google chrome. WHAT DO I NEED FROM YOU PEOPLE? it is that i want to get rid of this wmode=opaque thing as it makes the game slow even in google chrome which is effecting game playing quality, i used window,transparent too but nothing good came out of it. Only google chrome is asking for the wmode, while our step child internet explorer is happy with it, hehehehe Please someone help me out i am literally taking out my hair, lol some more information i would like to provide so that things work fast, i am using blogger blog, i have knowledge of html,xhtml,css, and for java or jquery its hint and trial. thanks for reading the long story and giving me time, if you can help please help me out, and i don't have money to pay for your service of help, otherwise why would i try to make blog xD. thank you Regards. Cryoffalcon. I have found a jQuery slide show at http://tobia.github.com/CrossSlide/ which interests me because of its smooth, cross-browser fade transitions. I would like to add a feature which automatically resizes the images proportionally, to fit the browser window. This feature is demonstrated in the Supersized slide show at www.mauitradewinds.com, but I am not satisfied with the quality of fade transition with Supersized -- especially under Safari. I would appreciate any guidance as to how to implement auto-resizing with the Cross-slide plug-in. Additionally, it would help if Cross-slide launched the slide show without waiting for all images to load.
Figured it out... admin can delete.
Hello. Am I missing any coding or anything? I'm really confused and have yet to find any help. I got the instructions from http://www.huddletogether.com/projects/lightbox2/ I would go to their forums but haven't received an approval email for over a week. Odd. Anyway, here is my link with the sample thumbnail. It opens the image in a new page. Thanks! http://creativepink.net/packaging.php Hi, I am using Lightbox+ and overall it's very good for my needs. However it has a small problem that is causing me to loose hair, I have tried to fix it but my grasp of Javascript just isn't cutting it. If you goto http://serennz.sakura.ne.jp/toybox/lightbox/ and click on the image "Sample 2" then use the next arrow to go to "Sample 3" you have to hover off the image and then back on to get the previous and zoom icons to show again. I have been able to make the bug occur every time in both Firefox 3.6 and IE6. I am guessing the mouseover event isn't triggering correctly due to the image object moving underneath the mouse pointer but I just can't fix it. Any help, pushes in the right direction, anything. Cam. Hi, could someone please tell me what I'm doing wrong with this page? http://www.silvergatehomes.com/customhomestest.html I've tried a bunch of things and cannot figure out what I'm doing wrong. Thanks. P.S. The reason I'm writing is because the images aren't opening. can some tell me how this image gallery with lightbox is done? I am trying to figure this out and was searching, but couldn't find how this was implemented with lightbox. http://www.davirusso.com/work/ http://www.fotoderyadijital.somee.co...cekimleri.html why my gallery is too slow when i double click the image is it about lightbox script or images is too big size. can you check for me. |
|||||||