• 0

Please help with my jquery issue, 2 scripts together


Question

I'm trying to get 2 jquery scripts to both work on the same page. One just shows text over a thumbnail when it's hovered over, the other just expands the thumbnail when it's click on. I'm so close I can almost taste it but I'm totally stumped now :/  To make things easier, here is a tiny .zip so you can see what I'm doing. http://www.classicdragons.org/TEMP.zip

 

Just open temp.html and you can see that the hover over jquery works perfectly, but clicking does nothing. Then just remove this from temp.html :

 

$(function() {
    $('img').hover_caption();
  });

 

...and you will see that the hover jquery is now of course broken but now the click to expand the thumbnail jquery works.

 

I'm desperately trying to get these to work together! Please help, I would really appreciate! Thank you in advance!!!!

 

Alex

14 answers to this question

Recommended Posts

  • 0

Ok, so far it appears that the overlay is getting in the way of letting you click the actual image when it is created. I am still looking.

 

EDIT: What about just changing the height of the caption overlay so it doesn't take up the whole image?

Edited by winlonghorn
  • 0

With help from winlonghorn, he has helped me so the hover over works and when I click on the image, it brings up the viewer. However the full image doesn't display in the viewer.

 

I have updated the link in my OP to reflect where I stand currently. I'm so close now! Just need to figure out why the image doesn't display in the viewer.

 

Any help much appreciated! Thanks!

  • 0

The reason that you don't see the full image is because of this code in /css/jsgallery.css:

 

.jsgallery-container #jsgall_imageContainer:before {    /* create a full-height inline block pseudo=element */
    content: ' ';
    display: inline-block;
    vertical-align: middle !important; 
    height: 100%;
}

That code is inserting a block above your full size image in the viewer that is the full height of the page, thus the full image is pushed off of the screen. Removing that style block makes your full-size image visible.

  • 0

When I remove that, the image appears, but then the full size image still has the shadow covering it until I move the courser off screen. Plus clicking anywhere doesn't remove the full size, it just reloads it.

 

But that is a step forward, thanks!!!!!!! I've been stuck on this for weeks lol.

  • 0

The reason that clicking on the full-size image doesn't close the full-size view is because you've setup the gallery script to run whenever an <img/> is clicked. Since the full-size image is rendered as an <img/> tag, clicking on it actually runs the gallery script again.

  • 0

I simply want to be able to mouse over an image (it's an art gallery web page with dozens of thumbnails on a page), the mouse over display a description of the image, then if clicked, the full size image shown. Then clicking anywhere will exit out of the full image view, or clicking next or swiping next when in full image view go to the next images in full size.

 

Thanks for any help, this is really challenging me, not my programming expertise at all :/

Edited by anguilla1980
This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Dead By Daylight and three more games join Xbox Free Play Days this weekend by Pulasthi Ariyasinghe As the weekend approaches, Microsoft has brought along another Free Play Days promotion for Game Pass subscribers to jump into. This time, Dead by Daylight, Headbangers: Rhythm Royale, Trailmakers, and Synduality Echo of Ada are all available for Xbox Game Pass Ultimate, Standard, and Core members for no extra cost. As always, any progress made during the weekend also carries over automatically if you decide to purchase a game afterward. From the four games available, Dead by Daylight should be the most familiar to most gamers. The multiplayer four-versus-one asymmetric survival horror game has you assuming the roles of survivors or the killer to see who can come out on top. Next, Headbangers: Rhythm Royale lands as a light-hearted, rhythm-based battle royale game. Up to 30 players can be in a single round, all represented as pigeons, before various mini-games involving increasingly difficult rhythm challenges get thrown at the group. The last remaining pigeon becomes the "Master Headbanger." Meanwhile, Trailmakers is a popular sandbox experience where you and your friends construct physics-based vehicles. A wide range of modular parts are offered for making these vehicles, with an exploration element also adding more options to search for. Adventure, sandbox, and racing modes arrive as options for playing either solo or in multiplayer. Lastly, the Synduality Echo of Ada is a sci-fi extraction shooter experience where you control mechs as you search for loot while fighting AI and other players. Here are the store links for the announced titles and their supported platforms: Dead by Daylight - $11.99 (Xbox Series X|S, Xbox One) Headbangers: Rhythm Royale - $3.99 (Xbox Series X|S, Xbox One, PC) Trailmakers - $14.99 (Xbox Series X|S, Xbox One, PC) SYNDUALITY Echo of Ada - $29.99 (Xbox Series X|S) This Free Play Days promotion will end on Sunday, June 22, at 11:59 pm PT. Following this, expect another round of games to enter the program next Thursday, June 26.
    • I'm not simping, I'm telling it how it is. This is the norm and has been forever. Profits need to keep growing, it doesn't matter if you are valued at a trillion or a million. As long as you are part of public trading that's the name of the game. If it's cheaper for the company to outsource, they will, and you'll get laid off. Welcome to capitalism 101. Like I said, the problem is the system itself.
    • Samsung may offer Galaxy AI free for life on the Galaxy Z Fold7, Z Flip7, and Z Flip7 FE by Sagar Naresh Bhavsar Samsung is all set to unveil its latest foldables: the Galaxy Z Fold7, Z Flip7, the affordable Z Flip7 FE, along with the Galaxy Watch8 series at the Unpacked event, possibly in New York City. The Galaxy Z Fold7 is expected to be the thinnest book-style foldable from the company, while the Galaxy Z Flip7 is tipped to come with a full-screen cover display. These devices are almost confirmed to launch with Android 16-based One UI 8 out of the box, the beta of which is already live for the Galaxy S25 series. Samsung is also expected to give a glimpse of its first XR headset, the Galaxy XR, dubbed "Project Moohan," at the event. However, there may be something more exciting coming for upcoming foldable fans. A reliable leaker, PandaFlashPro on X, has tipped that you might get all Galaxy AI features for free for life with the upcoming Galaxy Z Flip7 and Galaxy Z Fold7. Notably, Galaxy AI will also reportedly be permanently free on the affordable Galaxy Z Flip7 FE. The leaker also claimed that the Galaxy Z Fold7, Z Flip7, and Z Flip7 FE will also come with Gemini Advanced plus 2TB of cloud storage, free for six months. This is similar to theoffer that Samsung offered the Galaxy S25 series earlier this year. However, the company cleared the air that the Galaxy AI features on the Galaxy S25 series will be free till the end of 2025, after which a subscription-based model will be introduced. If true, then you will be able to enjoy Galaxy AI features such as Sketch to Image, Generative Image, Note Assist, Live Translate, Interpreter, Chat Assist, etc., free for a lifetime on the upcoming foldables, setting it apart from its competitors.
    • Summary for all: Some WD SSDs need firmware updates for 24H2.
    • Next-gen AMD GPUs reported to support HDMI 2.2 with up to 80Gbit/s bandwidth by Aditya Tiwari Some beans have spilled around AMD's rumored upgrades for its next-generation graphics architecture. The American silicon giant is expected to support up to 80 Gbps mode on HDMI 2.2 for its upcoming graphics architecture, internally codenamed GFX13, and expected to launch as RDNA 5 or UDNA. The latest information comes from the leaker @Kepler_L2, who took to their social media account on X (via VideoCardz). It strengthens the hopes of the latest HDMI standard and support for faster bandwidth making their way to the next generation of AMD GPUs. The HDMI 2.2 standard was announced earlier this year and released to manufacturers in the first half of 2025. It pushes the maximum allowed bit rate to 96 Gbps and supports Latency Indication Protocol (LIP) to improve audio and video synchronization. However, according to Kepler's post, RDNA 5 GPUs are expected to support only 64 Gbps and 80 Gbps modes. This suggests that the 96 Gbps mode may not be supported on the new architecture, while it remains unclear whether this is due to some hardware limitation or will be added later. Although the new piece of information pertains to GFX13, it doesn't clarify whether it's related to the PRO or Radeon RX series. The company has previously used UHBR 13.5 (54 Gbps) for its consumer-focused GPUs to reduce costs while supporting UHBR 20 (80 Gbps) on PRO cards, according to the leaker. It remains to be seen whether AMD treats the two product lines the same or differently. Another standard announced earlier this year was DisplayPort 2.1b, which keeps the same maximum bandwidth of 80 Gbps but supports three times the cable length for UHBR20 GPU-to-display connections compared to existing VESA-certified DP80 passive cables. The new standard is supported on NVIDIA's RTX 50 and RTX PRO Blackwell series GPUs. For now, there is no update on whether AMD will bring DisplayPort 2.1b support to the GFX13 architecture.
  • Recent Achievements

    • First Post
      MikeK13 earned a badge
      First Post
    • One Month Later
      OHI Accounting earned a badge
      One Month Later
    • Week One Done
      OHI Accounting earned a badge
      Week One Done
    • First Post
      Thornskade earned a badge
      First Post
    • Week One Done
      Higante88 earned a badge
      Week One Done
  • Popular Contributors

    1. 1
      +primortal
      706
    2. 2
      ATLien_0
      267
    3. 3
      Michael Scrip
      202
    4. 4
      +FloatingFatMan
      174
    5. 5
      Steven P.
      127
  • Tell a friend

    Love Neowin? Tell a friend!