- This topic is empty.
July 1, 2014 at 4:08 am #174200
I would like the images in this slider http://codepen.io/jenbi/pen/vwshC to be linked to webpages on our site. I would be more than thankful if someone could look into it and hopefully give me a solution.
/Swedish LibrarianJuly 1, 2014 at 5:28 am #174210
The HTML is invalid unfortunately as you cannot have any elements other than
lias direct children of a
That’s the first issue you should address but there are many other HTML structural errors too.July 1, 2014 at 5:32 am #174211
Well, as I said I am a total newbie to all coding. What do you suggest?July 1, 2014 at 5:46 am #174213
I appreciate that we all have to start somewhere but if this is for time-sensitive project then you really have a couple of options.
Get a professional to do it for you, or…
Find a pre-built slider with the functionality you need and just ‘plug it in’ based on the instruction documents….there are hundreds (if not thousands) of them out there.
Try googling Jquery Slider and you’ll see.
If it’s less time critical them you could google for slider tutorials (unfortunately, we’re not that kind of site).
Another option is to take one of those pre-built slider ‘plug-ins’ and work your way through the code to understand how these are built and what customisation you can do on your own.
Validate your HTML whenever possible.
I noticed some ‘unusual’ elements in your Codepen
h10….I suppose these might actually exist but I’ve never seen
htags with a number higher than 6 and I’ve rarely seen anything higher than 4 used on a live site.
That’s not to say that you can’t create your own ‘custom’ elements, it’s just that you run the risk of browsers not understanding them and failing to render them properly. It’s not recommended that custom elements be used (there are more than enough validated elements to use already) but, as I said, you can…but I wouldn’t.July 1, 2014 at 6:33 am #174219
Well thank you.
The googleing is just what I have done….done again…. and done again ( for several hours)…. and actually (belive it or not) the slider I have used is a pre-built + some overlay code from one of the turtorials on this site.
But thanks for your advice to get a professional help and for the advice to not use custom elements that correlate with actual tags.July 1, 2014 at 6:39 am #174221
the slider I have used is a pre-built + some overlay code from one of the turtorials on this site.
Which pre-built slider? Can you provide a link to the original demo?
My advice, if you still want it and you wish to proceed,it to start with a slider that works without the extra functionality you want and use that as a base.
Then we can look at the base and see what we can add, progressively, to make sure it stays functional.July 1, 2014 at 6:41 am #174222July 1, 2014 at 6:55 am #174226
Oh…dear…As I said…it’s invalid HTML.
..but if that’s not a problem for you?July 1, 2014 at 7:09 am #174227
No, of course I would like a correct HTML, but as my knowledge in coding is way to insufficient to be able to determine what is correct or not, how can I detect which slider is invalid or not to start with?
Then, so what solution = get professional help….;)July 1, 2014 at 7:18 am #174229SenffParticipant
@Paulie_D The original pen is not done by the OP but he’s using that as a reference. I believe the invalid HTML is fine, the inputs do serve a purpose (as listeners/internal indicators to see which slide should be “active” as well )…I wouldn’t call it an “oh dear” situation, but I agree it feels a little dirty.
Now the original issue….
I would like the images in this slider http://codepen.io/jenbi/pen/vwshC to be linked to webpages on our site.
It makes sense that nothing happens when you click on any image, because there are images on top of them — which you don’t see.
(This is the way the slider works; all slides are stacked on top of eachother, all of them are transparent, except one. So basically, you’re always clicking on the last slide, which is on top of everything else.)
It’ll be kind of difficult to make each individual slide clickable with this slider, and you may want to look into another one that does have that functionality.July 1, 2014 at 7:35 am #174231
The original pen is not done by the OP but he’s using that as a reference.
Yes, I was aware of that but i had assumed that the ‘pre-built’ slider would be more…”professional” (for wont of a better word).
I believe the invalid HTML is fine
It works….true enough, but it’s still invalid (as in it won’t pass the usual validation tests) …and, as you say, dirty.
It’ll be kind of difficult to make each individual slide clickable with this slider, and you may want to look into another one that does have that functionality.
Yes…indeed. This is one of the reasons I suggested a pre-built slider with the required functionality being an included option.July 1, 2014 at 9:32 am #174250
Thank you so much for your kind and informative answer. I am very thankful for your respond to my original question.
I have been looking around quite a bit to find a slider which supports linking images. Unfortunately I do not have axess to the original html page due to LMS licenses restrictions, which also makes it impossible for me to use a plugin slider.
Do you know of any slider that supports linking and works under these permissions?July 1, 2014 at 10:22 am #174255SenffParticipant
A Google search for “CSS slider” gave me this one: http://cssdeck.com/labs/css3-image-slider
Thank you so much! I will try that one.July 2, 2014 at 4:47 am #174334
Unfortainly the forward arrows and buttons did not work when implementing code on webpage (without changeing anything). Back to ground zero….
- The forum ‘CSS’ is closed to new topics and replies.