I'm very new to Bootstrap. I've literally written the code and put the links where instructed. I haven't downloaded any plugins or any other support files as I don't understand it.
Anyway, I've been told (after writing my website) that I should've used Bootstrap 4 not 3. So I'm currently re-writing it. Which is going OK until I got to my image galleries with popup lightbox using modals. I changed the link in the header to the Bootstrap 4.1 version but it's made my lightbox modal popup go wrong in the image gallery. The arrows are in the wrong place to flow forward and back throught the images and the images are now vertical not horizontal in the modal gallery.
This is my Bootstrap 3 version:
http://www.rockclick.co.uk/skating.htm
And this is my Boostrap 4 version:
http://www.rockclick.co.uk/skating1.htm
People keep telling me that Bootstrap is the way to go as it's easier but tbh I'm finding it tricky! Perhaps the more I use it the better it will be? Or am I missing something??
I can't paste all the coding as it's too long, but all I'm using is in the source files for these two pages.
Can anyone tell me what's gone wrong?
Related
I have been trying to replace my carrousel images with t new photos from my phone camera or album, but for some binding reason, they don't display on the carousel.
I am using Xamarin Media Plugin.
any picture I select should display on the carousel. I have been trying everything in here. IMAGE URL works fine, stored images in the resources folder, works as well. but, for some reason display the images from the media is been a nightmare.
You can clone my sample project # GITHUB
I will appreciate Any help.
Looking at the GITHUB project, easy to understand why no relevant code here, it will require the whole sample project. It seems the carousel is not getting updated when uploading an image, binding?? I am still checking.
It may appear a repeated question but it is a serious one and I found no solution for it in any related question.
I have downloaded a bootstrap theme from ShapeBootstrap website
Demo theme
I use Firefox 30. As you may see in the demo page too, the slider doesn't start automatically! however if one click on the next slide it starts running!
I did anything I read in the similar questions but nothing happened!
The order of scripts is OK
It is in the end of file
No error reported in console ...
You can view and follow the source code of the demo page. Everything is in its place. But I wonder why it has this problem even in the official website of the theme.
Please guide me what can I do.
To understand what was going wrong was difficult!
I replaced the carousal section(html) with this one from http://startbootstrap.com/templates/full-slider/
I added full-slider.css to the list of my css files and used the latest version of bootstrap script and now it works!
I'm checking out DivShot for the first time, and have fallen at the first hurdle.
On launching the app, I get the page editing screen, as expected, with the Inspector, Components and Page Options tabs on the right hand side of the screen.
But on the left hand side, there is no Navigator. And I can find no reference to the Navigator anywhere on the screen (thinking it might be a collapsed area, or something).
Looking at the Intro video on the Divshot website, there do seem to be some minor differences (the lack of the Navigator notwithstanding), so I am wondering whether something has changed in the latest release...
In any case, I can see no way of add files/resources/folder structures other than new pages, because of the absence of the Navigator.
Can anyone shed any light?
Much appreciated :)
It sounds like you're using the now legacy version of Divshot. We recently launched Divshot 1.0 with file support and a completely revamped project structure.
Legacy: http://app.divshot.com
New Divshot: http://builder.divshot.com
It's on a separate instance so beta users have time to export their pages and finish anything up in the old version before upgrading. Since we moved from generic folders and pages to actual files we're offering a manual upgrade.
If you'd like to update you can just go to https://api.divshot.com/upgrade and follow the instructions there. We're pushing a notice to the old version right away to eliminate any confusion. Sorry about that!
I want to put a file sample.pdf on my website, and want it to be displayed using pdf.js. What I want is to display my own file like the demo, with a toolbar, zooming in/out, etc. So far I can't do that yet.
I did check out the helloworld example, but it simply shows the file like an image, without toolbar, zooming in/out, etc. When I put another file with many pages instead of helloworld.pdf, it just shows the first page.
I am not quite sure what you are looking for but I was able to get this working exactly like the demo. Although you may not want to use that example viewer for your project, you can use the working code as a starting point for your own requirements.
For a simple test you can just clone the project somewhere under a web server into a directory like myproject and visit http://yourservername.com/myproject/web/viewer.html. You should see the pdf appear. This can be a starting point to working with this project. I did this running a very basic Apache server on Linux.
If you are not looking for an example styled like that the demo above you can also see this jsbin from the docs that show how to do something completely customized with working next/previous buttons to move between the pages (as you mentioned you were only seeing the first page).
As a note, it seems that this library does not work properly with Safari. You can see an issue about it here. Unfortunately this makes it unusable for me now as I need to support all current browsers.
Also, remember to watch for the warnings concerning CORS.
I've been playing around with EasySlider and everything was working perfectly - until I viewed my site in IE9.
Instead of displaying the slider with 3 images sliding across, it displayed all 3 images sat one underneath the other, and a message at the bottom of the screen saying that scripts etc had been blocked and did I want to allow blocked content.
As I was using this in the hear of my website it pushed my whole site down the page and just looked stupid with the 3 banners on top of each other.
I realise I can get rid of this by unblocking the content, but that's not the point. I think this is the default security settings for IE so everyone that visits my site will see it like this for the first time (or everytime if they don't unblock the content).
So is there a way around this? Or at least a way that if the script is blocked only the first image is shown instead of all of them? This seems a pretty big flaw!
I had the same issue as you and found a very simple solution for it using CSS. All you need to do is copy and paste the line of CSS code below onto the screen.css stylesheet that came with the EasySlider 1.7 Plugin. I hope this helps.
#slider {
position:relative;
}
I found this solution at the "ClickNathan Handmade Websites".