Auto-changing of images is not working in Lightbox2 version 2.9.0.
I have not changed any settings etc., all out of the box. Used on a very old html-page
http://www.provelo-regionthun.ch/index.html
Controls don't show either.
So, try to put this script in a bottom of lightbox.js
lightbox.option({
'wrapAround': true
});
or directly in HTML(before </body>)
<script>
lightbox.option({
'wrapAround': true
})
</script>
Related
I am using React as my front-end (and Rails as my back-end).
I am setting up the Facebook Pixel Events Manager to track my Facebook ads on my website.
So I added this script to my public/index.html:
<!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'MYID');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=MYID&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
and in my React Components I added this callback function anytime a button is clicked and raise an event:
() => fbq('track', 'MyEvent');
It seems to work, although I need my pixels to fire only in production. I can't access process.env.NODE_ENV in public/index.html.
What can I do to have this code used only in production ?
In most of my simple apps I choose to manage this by printing a JS variable into the html page. My prefer goto is Handlebars and I'll inject a config object into the header that will contain something like.
<script type="application/javascript">
var CONFIG = {
fbPixel: '{{ fbPixel }}'
}
</script>
The fbPixel comes from a config file and is only populated in staging and production environments. In development it's undefined/empty. Quick and simple to setup. In my more complicated apps I still basically do the same thing, but use a helper function in the middle for validation and allowing of default options.
thanks to #Dvid Silva and #Russ Brown, I finaly went with the following solution: create two separate index.html files: dev-index.html and prod-index.html
in my config/path.js:
module.exports = {
#[...]
appHtml: process.env.NODE_ENV === 'production' ? resolveApp('public/prod-index.html') : resolveApp('public/dev-index.html'),
#[...]
};
Both index files are identical except the production one has the Facebook Pixel inside its <head> tag.
an alternative solution: if you use git;
checkout from your "master" branch, and create a new branch called "dev":
git checkout -b dev
then on your "master" branch, reserved for production, inject the pixel code base. Checkout again to your dev branch and work there.
When you want to push new features into production, merge "dev" into "master", while keeping 2 versions of the file index.html
Speaking of lightbox2 version 2.8? downloaded march 2016...
How set maxwidth?
Here mi setup:
Under mi website folder i've, created a folder 'lightbox2' and put into the contain of the 'dist' folder of lightbox: css, images and js folders.
Then into de 'head'`section of html page, enter this code:
<link rel="stylesheet" href="lightbox2/css/lightbox.min.css">
<script>
lightbox.option({
'maxWidth' : 400,
})
<script>
and
<script src="lightbox2/js/lightbox-plus-jquery.min.js"></script>
at end of page
Now display the image with:
<img src=image-sample.jpg width=120 border=0>
The image always show at original size!
Help, please
well ... after searching and testing, I discovered that options should go under the line that invokes the js, not the css :)
After this, the image limit size work ok.
I am new in angular js.Creating a stuff using angular js.Using radio button to select item .But this not running in my sysytem. http://jsfiddle.net/NfPcH/559/. copyied code form jsfiddle.
It contain the file
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/
1.0.7/angular.min.js" type="text/javascript"></script>
Got output
{{ showStatus() }}
Any body say the reason of not running the code in my system?
editable-radiolist and e-ng-options are not standard angular directives.
Click on 'External Resources' on the left - u'll see that this example also uses:
xeditable.js
bootstrap.min.css
xeditable.css
checklist-model.js
I have a <div> in my HTML page. What I need to do is, add <ul> element inside it from my Entry point class. I have tried from onModuleLoad function using below code,
UListElement ul=Document.get().createULElement();
ImageElement img=Document.get().createImageElement();
img.setSrc("\\images\\personas");
LIElement li=Document.get().createLIElement();
li.appendChild(img);
ul.appendChild(li);
Document.get().getElementById("divPhotos").appendChild(ul);
but my <div> is empty/has no childs when i run it. what am I missing here?
Your code is okay assuming you have correctly assigned the "divPhotos" id to a div in your HTML DOM. I suspect that you are viewing the page source and expecting to see the newly appended DOM elements. What you want to view is the pages live DOM. How you inspect the DOM in depends on the web browser you are using. if your using Google Chrome, press F12 to access the debugging tools which will allow you to transverse the live DOM. For Firefox, you need to install Firebug. Other browsers provide their own debugging mechanisms.
I have forgot to add nocache.js in html page.
<script type="text/javascript" language="javascript" src="test/test.nocache.js"></script>
Its working now...
I've added the required tags, but it is still not showing. I've added this in head:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'lt', parsetags:'explicit'}
</script>
and this in the body:
<g:plusone href="http://www.fanuspinta.lt/katalogas/lietuva-mar%C5%A1kin%C4%97liai-31"></g:plusone>
At first I thought it didn't show up because I was using a local server, but now it's in production, and still not showing.
URL in case: http://www.fanuspinta.lt/katalogas/lietuva-mar%C5%A1kin%C4%97liai-31
Thanks for any ideas.
I used a html5 tag like shown here without the data-href attribute, dynamically added it afterwards (when the lightbox was loaded) and explicitely loaded the div containing the plusone code at the end.