jquery plug in or Html Code - jquery-plugins

Is there a way to add additional photos per set? I can’t see the previous and next buttons once i click on one single image from the gallery images. Does anyone know the code i need to activate this? The gallery was built using Pretty Photo lightbox plugin. I appreciate your time in advance. thanks
example of site: http://www.diligentworks.com/FOA/index1.htm
this actually reads like this:
PHOTO GALLERY
<div class="tabcontent">
<div class="gallery"> <img src="./img/tgallery-item-01.jpg" width="150" height="120" alt="gallery-item-01" />
<img src="./img/tgallery-item-02.jpg" width="150" height="120" alt="gallery-item-01" />
<img src="./img/tgallery-item-03.jpg" width="150" height="120" alt="gallery-item-01" />
<img src="./img/tgallery-item-04.jpg" width="150" height="120" alt="gallery-item-01" />
<img src="./img/tgallery-item-05.jpg" width="150" height="120" alt="gallery-item-01" />
<img src="./img/tgallery-item-06.jpg" width="150" height="120" alt="gallery-item-01" />
</div>

From http://forums.no-margin-for-errors.com/discussion/comment/2958/#Comment_2958:
To use the gallery functionality, you
need to add the gallery name in
braket. Like so:
<a href="" rel="prettyPhoto[gallery]">

Related

How can i add a link on a specific point of the image?

I have the following image and i want to add a link on the basket icon. How is that possible?
Thanks for your answers. Now i have two ways to do this or with html:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<p style="font-weight:normal;text-transform:uppercase;color:#FFD700;background-color:#000000;border: 5px ridge #ababab;letter-spacing:4pt;word-spacing:-3pt;font-size:42px;text-align:center;font-family:georgia, serif;line-height:4;margin:0px;padding:0px;width:100%;height:183px;">New Online Shop <i class="fa fa-shopping-cart " aria-hidden="true"></i>
</p>
Or with #blue answer using html shape attribute on the image:
<img src='https://i.stack.imgur.com/5I8q6.jpg' width='500' height='150' usemap='#basket' />
<map name='basket'>
<area shape='rect' coords='440 50 500 100' href='www.your_link.com' alt='basket_icon' />
</map>
<p>Click on the basket</p>
Try to use map and area to select specific areas on an image
The HTML
<img src='https://i.stack.imgur.com/5I8q6.jpg' width='500' height='150' usemap='#basket' />
<map name='basket'>
<area shape='rect' coords='440 50 500 100' href='www.your_link.com' alt='basket_icon' />
</map>
<p>Click on the basket</p>
I hope this helps!

Laravel images are not displayed

I want to display the images in my view. The images are located in public folder in folder name img.
I've tried following solutions:
<img href="{{URL::to('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
<img src="{{URL::to('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
<img href="{{URL::asset('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
<img src="{{URL::asset('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
<img href="{{asset('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
<img src="{{asset('img/zajeciadodatkowe.png')}}" alt="Image" height="200" width="200">
This problem occured when I put the laravel app onto development server.
Someone has any suggestions?
Use the asset() helper:
<img src="{{ asset('img/zajeciadodatkowe.png') }}">
And make sure the zajeciadodatkowe.png image is in public/img directory.

410 Gone - Images are on right directory

On my site some of my products picture are not shown.
When i right click to inspect element and click my pictures url there is written
410 GONE
When i refresh the site image is shown.
I have lots of products so pictures too on my site and thats a big problem for me.
Thanks for helping.
<div class="productGallery"> <img id="product" width="450" height="405" src="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_1b.jpg" data-zoom-image="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_1b.jpg" />
<c:if test="${prdDemo != ''}"><a onclick="OpenTv();" class="watch"></a></c:if>
<div id="productGallery">
<img onerror="this.src='assets/images/nophoto-140x125.jpg'" id="img_01" src="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_1b.jpg" width="70" height="70" />
<img onerror="this.src='assets/images/nophoto-140x125.jpg'" id="img_01" src="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_2b.jpg" width="70" height="70" />
<img onerror="this.src='assets/images/nophoto-140x125.jpg'" id="img_01" src="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_3b.jpg" width="70" height="70" />
<a href="#" data-image="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_4b.jpg" data-zoom-image="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_4b.jpg"> <img onerror="this.src='assets/images/nophoto-140x125.jpg'" id="img_01" src="http://www.mydomain.com.tr/files/data/OrgImage/v2/<c:out value="${prdPictureOrj}"/>_4b.jpg" width="70" height="70" />
<a onclick="OpenTv();" class="tv_icon"></a></a>
</div>
</div>

How to set a number of error with xul like firebug does

As the question explains itself i've a button like firebug and i wanted to set there a number when some events happens like firebug doeas when it detects errors on the page.
Does anyone know how to set it?
This is the code of the top button that displays a panel, so i want to set there a number when certains events happens..
<panel id="asv-panel">
<hbox align="start">
<vbox>
<hbox align="center" style="background-color:#ffffff">
<image id="asvbutton-panel-icon" width="200px" height="50px" style="margin-left:10px"/>
</hbox>
<hbox style="background-color:#fff" id="menuPanelContainer">
<html:div style="margin-top:20px;margin-left:20px;width:150px" id="menuLogginInicial">
<description value="&asbutton.Signin;"/>
<html:hr/>
<image id="asvbutton-logoface" width="50px" height="50px" style="cursor:pointer" onclick="asvbutton.login();"/>
<image id="asvbutton-logogoogle" width="47px" height="45px" style="align:left;cursor:pointer"/>
<image id="asvbutton-logotwitter" width="50px" height="50px" style="align:left;cursor:pointer"/>
</html:div>
</hbox>
</vbox>
</hbox>
</panel>
</toolbarbutton>
After thousands of pages and samples... the easiest way was creating a div and doing an appendChild to it (old school method) :D
Hope this helps someone.

displaying profile picture across the networking app dynamically for every controller and gsp in Grails

I am using this to display profile picture on every page on the system but only works with few pages.
<g:if test="${userAccount?.photo != null && !(userAccount?.photo.empty)}" >
<g:link controller="userAccount" action="myInfo" id="${userAccount.id}">
<img id="profile_photo" src="${createLink(controller:'image', action:'profilePhoto', id:userAccount.photo, params:[maxWidth:190.0,maxHeight:190.0])}" alt="${userAccount.photo}" title="${userAccount.displayName()}" />
</g:link>
</g:if>
<g:else>
<g:link controller="userAccount" action="myInfo" id="${userAccount.id}">
<img id="profile_photo" src="${resource(dir:'images', file:'no_image_blue.gif')}" alt="No Image" width="200" height="200"/>
</g:link>
</g:else>
I am also using 2 layouts and Spring security plugin for this project.
Could anyone please help me out here to make an image gets displayed on entire system.
**
I simply need to know how can i store users Photo varaible to session
so i can access it anywhere in the application.
**
Put this code into the two layout views, for instance, layout/main.gsp and layout/custom.gsp, and declare using it in each gsp view's , as
<meta name="layout" content="main">
or
<meta name="layout" content="custom">
To access user information like photo, leverage spring security's <sec:loggedInUserInfo> tag:
<g:set var="photo" value="${sec.loggedInUserInfo([field:'photo'])}"/>
<g:set var="userId" value="${sec.loggedInUserInfo([field:'id'])}"/>
<g:if test="${photo != null && !(photo.empty)}" >
<g:link controller="userAccount" action="myInfo" id="${userId}">
<img id="profile_photo" src="${createLink(controller:'image', action:'profilePhoto', id:photo, params:[maxWidth:190.0,maxHeight:190.0])}" alt="${photo}" />
</g:link>
</g:if>
<g:else>
<g:link controller="userAccount" action="myInfo" id="${id}">
<img id="profile_photo" src="${resource(dir:'images', file:'no_image_blue.gif')}" alt="No Image" width="200" height="200"/>
</g:link>
</g:else>

Resources