Search the Community

Showing results for tags 'lightbox'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Calendars

  • Community Calendar

Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 10 results

  1. I whenever I hit on an image on the Lightbox the image is always loading in reverse to what it should be so when I hit image 4 it is showing image 1, please help me here is the code <div class="galleryrow"> <div class="column"> <img src="images/gallery image 4.jpg" style="width:90%" onclick="openModal();currentSlide(4)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 3.jpg" style="width:90%" onclick="openModal();currentSlide(3)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 2.jpg" style="width:90%" onclick="openModal();currentSlide(2)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 1.jpg" style="width:90%" onclick="openModal();currentSlide(1)" class="hover-shadow cursor" height="195px"> </div> </div> <div id="myModal" class="modal"> <span class="close cursor" onclick="closeModal()">×</span> <div class="modal-content"> <div class="mySlides"> <img src="images/gallery image 4.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 3.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 2.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 1.jpg" style="width:100%" height="700px"> </div> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> <div class="caption-container"> <p id="caption"></p> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 4.jpg" style="width:100%" onclick="currentSlide(4)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 3.jpg" style="width:100%" onclick="currentSlide(3)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 2.jpg" style="width:100%" onclick="currentSlide(2)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 1.jpg" style="width:100%" onclick="currentSlide(1)" alt="Home"> </div> </div> </div> <script> function openModal() { document.getElementById('myModal').style.display = "block"; } function closeModal() { document.getElementById('myModal').style.display = "none"; } var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("demo"); var captionText = document.getElementById("caption"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides.style.display = "none"; } for (i = 0; i < dots.length; i++) { dots.className = dots.className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; captionText.innerHTML = dots[slideIndex-1].alt; } </script>
  2. does anyone know why this doesn't work? it shows the picture but when I hit on it to maximise it, its not there. please help <div class="galleryrow"> <div class="column"> <img src="images/gallery image 10.jpg" style="width:90%" onclick="openModal();currentSlide(10)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 9.jpg" style="width:90%" onclick="openModal();currentSlide(9)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 8.jpg" style="width:90%" onclick="openModal();currentSlide(8)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 7.jpg" style="width:90%" onclick="openModal();currentSlide(7)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 6.jpg" style="width:90%" onclick="openModal();currentSlide(6)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 5.jpg" style="width:90%" onclick="openModal();currentSlide(5)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 4.jpg" style="width:90%" onclick="openModal();currentSlide(4)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 3.jpg" style="width:90%" onclick="openModal();currentSlide(3)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 2.jpg" style="width:90%" onclick="openModal();currentSlide(2)" class="hover-shadow cursor" height="195px"> </div> <div class="column"> <img src="images/gallery image 1.jpg" style="width:90%" onclick="openModal();currentSlide(1)" class="hover-shadow cursor" height="195px"> </div> </div> <div id="myModal" class="modal"> <span class="close cursor" onclick="closeModal()">×</span> <div class="modal-content"> <div class="mySlides"> <img src="images/gallery image 10.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 9.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 8.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 7.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 6.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 5.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 4.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 3.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 2.jpg" style="width:100%" height="700px"> </div> <div class="mySlides"> <img src="images/gallery image 1.jpg" style="width:100%" height="700px"> </div> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> <div class="caption-container"> <p id="caption"></p> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 10.jpg" style="width:100%" onclick="currentSlide(10)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 9.jpg" style="width:100%" onclick="currentSlide(9)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 8.jpg" style="width:100%" onclick="currentSlide(8)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 7.jpg" style="width:100%" onclick="currentSlide(7)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 6.jpg" style="width:100%" onclick="currentSlide(6)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 5.jpg" style="width:100%" onclick="currentSlide(5)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 4.jpg" style="width:100%" onclick="currentSlide(4)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 3.jpg" style="width:100%" onclick="currentSlide(3)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 2.jpg" style="width:100%" onclick="currentSlide(2)" alt="Home extenshion"> </div> <div class="column"> <img class="demo cursor" src="images/gallery image 1.jpg" style="width:100%" onclick="currentSlide(1)" alt="Home"> </div> </div> </div> <script> function openModal() { document.getElementById('myModal').style.display = "block"; } function closeModal() { document.getElementById('myModal').style.display = "none"; } var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("demo"); var captionText = document.getElementById("caption"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides.style.display = "none"; } for (i = 0; i < dots.length; i++) { dots.className = dots.className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; captionText.innerHTML = dots[slideIndex-1].alt; } </script>
  3. Hi All, I'm running a website i.e. http://homepageforu.webs.com/, its running good, its a simple website with HTML & CSS, I like to add one signup page/image, which fades all the background icons, until n unless, either visitor subscribe to my website, or click cancel on that signup page (this page is also unblockable i.e. doesn't blocked by pop-up blocker) & in either condition, he/she can visit my website, but if he goes for sign up, than that page should be open in a new window. i've seen this in many websites specially with online shopping or coupons website, like "http://www.shopclues.com/mobiles/mobile-phones.html", the same signup page, when this website opens. Thanks in Advance Ashish
  4. Hello, I'm having trouble getting my back and next buttons in my lightbox to work! Any help will be greatly appreciated! http://imd.edumedia....term/index.html
  5. Hi, I just wanted to multiple lightbox slideshows in a page with different contents in each of lightbox slideshow. How can I do ? I tested in the following page but it does not work all shows same content. http://www.egtours.com/test.php
  6. I am trying to have a link submit some form data to a lightbox ( I am using facebox) and am having some trouble. The basic code I am working with is: <form name="form" method="post" action="test.asp"><ul><li><a href="#" onclick="document.forms['form'].dept.value = 'ACC'; document.forms['form'].course.value = '115'; document.form.submit('test.asp');" rel="facebox">ACC 115 Payroll Accounting</a></li></ul><input type="hidden" value="" name="dept" id="dept"><input type="hidden" value="" name="course" id="course"></form><script type="text/javascript">$('a[rel*=facebox]').facebox({ loading_image: '/images/loading.gif', close_image: '/images/closelabel.gif' });</script> This file submits to the test.asp file which processes the XML data which the course descriptions live. <%dim dept, coursedept = "ACC"course = "115"Set objxml = Server.CreateObject("Microsoft.XMLDOM")objxml.async = falseobjxml.load (Server.MapPath("classes.xml"))set ElemClass = objxml.getElementsByTagName("class[@dept='"&dept&"' and @class='"&course&"']")set ElemTitle = objxml.getElementsByTagName("class[@dept='"&dept&"' and @class='"&course&"']/title")set ElemDescription = objxml.getElementsByTagName("class[@dept='"&dept&"' and @class='"&course&"']/description")set ElemPrereqs = objxml.getElementsByTagName("class[@dept='"&dept&"' and @class='"&course&"']/prereqs")%><!DOCTYPE html><html><head><meta charset="utf-8"><title><% Response.Write(dept&" "&course) %></title></head><body><%For i=0 To (ElemClass.length -1)%><h3><% Response.Write(ElemTitle.item(i).Text) %></h3><p><% Response.Write(ElemDescription.item(i).Text) %></p><p><% Response.Write(ElemPrereqs.item(i).Text) %></p><%nextSet objxml = Nothing%></body></html> I have gotten everything to work, except I can't seem to get the form to put the test.asp in the lightbox. Help please!!
  7. I have a table layout for my picture gallery live example : http://test.repsolhondanc24.co.uk/ When you minimise it or have it on a smaller screen resolution the table does not reduce in size like the other page content section does. Where am I going wrong. I want the table to be all the same size for width and heigh per square alternatively is there a better picture gallery I can use with out using a table (I'm keeping the light-box feature)
  8. My website is getting closer to being completed but it does not validate and with over 278 errors, its annoying (im so tired now lol) Can someone look at the errors on the attached file and let me know what I need to do to correct it. (Its not the one with 278 errors as it says its too large so I uploaded the smaller page) ride-out-gallery.html
  9. I'm using the script here: http://lokeshdhakar....ects/lightbox2/ As the method of displaying the images here: http://www.kylenystrom.com/new Everything works fine except for this one thing: I need to update a screenshot of a website I developed (sunset.jpg), but I don't want another image in my sites directory. So, I updated it, and overwrote it; locally and on my web server. (The file has the same name and extension, but the actual image is different.) But the old image is still displaying in the lightbox. I've overwritten both the local and server copies more than twice, but to no avail. I've removed all other images from the local directory, and deleted them from the server and predictably, the other images do not show; they're not there. But for some reason, the old "sunset.jpg" loads and displays EVERY. TIME. I've looked at the lightbox script and can't tell if it's caching images or something, but this is driving me crazy. I really don't want to have to download, unzip, and integrate a fresh copy of the lightbox script every time I update an image. Does anyone know whats going on? All my code is readily available, but I'll post it here if needed. Thanks! Edit: What's even crazier is when I type in a direct URL to the offending image, it loads and displays, but when I refresh the page, I get a 404...
  10. Hi, I am busy testing out a lightbox form that I'm working on and I've got all to work except the "success" or "thank you" page.Basically I want the user to fill in the online form and when the they are click 'submit', the "thank you" message or page resolves in the same lightbox that the form was in. Go to www.testing123.co.za/test.htm and click on that link you see saying "AJAX SuperBox".The lightbox is opening up an HTML page within in the test.htm page (basically acting like an iFrame?).When I click submit, the page resolves to the success.htm page (which it should) but not in the lightbox frame. I don't want visitors to leave the test.htm page. My headers at the bottom of my process php form shows as: '; $headers = "From: $from\r\nBCC:{$bcc}\r\n"; $headers .= "Content-type: text/html\r\n"; $success = mail($to, $subject, $sBodyNew, $headers); header('Location: http://www.testing123.co.za/success.htm'); ?> I assume the Location url above needs code added to it so that it works within the lightbox? Or is there an easier way to do this? Thanks guys!