Log in

View Full Version : fruit machine reels picker list



theremotedr
01-09-2017, 04:14 PM
Looking for a scroll wheel picker.
Animated in its operation as the picker list looks like it spinning around.

"Original text deleted"

coothead
01-09-2017, 04:56 PM
Hi there theremotedr,


as requested, you did not say what it's functions are. :eek:

Nevertheless, test this code...



<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">

<title>untitled document</title>

<link rel="stylesheet" href="screen.css" media="screen">

<style media="screen">
body {
background-image: url(http://theremotedoctor.co.uk/m-images/background.png);
background-size: cover;
background-attachment: fixed;
background-position: center top;
font: 1em/1.62em verdana, arial, helvetica, sans-serif;
}

#chbx {
position: absolute;
left: -999em;
}

#dropdown {
display: none;
}

@media screen and (max-width:30em) {
#dropdown {
display: block;
}

#dropdown, #dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}

#dropdown li {
height: 3em;
line-height:3em;
box-sizing: border-box;
cursor: pointer;
}

#dropdown label {
display: block;
height: 100%;
margin-bottom: 0.4em;
font-weight: bold;
text-align: center;
background-color: #e6e6e6;
background-image: linear-gradient(to bottom, #efefef, #9f9f9f);
cursor: pointer;
}

#dropdown li:first-of-type {
border: 0.06em solid #000;
}

#dropdown div {
height: 0;
padding:0;
opacity: 0;
background-image: linear-gradient(to bottom, #a2a3a8,#282a39);
overflow: hidden;
transition: 0.5s ease-in-out;
}

#chbx:checked~#dropdown div {
height:15em;
padding: 0.5em;
border: 0.06em solid #000;
opacity: 1;
}

#dropdown ul {
border: 0.06em solid #000;
border-radius: 0.4em;
background-image: linear-gradient(to bottom, #ababb5 0%,#fcfcfe 25%,#fcfcfe 75%,#ababb5 100%);
box-shadow: inset 0 0 1em 0.75em rgba(0,0,0,0.4);
}

#dropdown ul li {
text-indent: 2em;
border: 0.06em solid transparent;
}

#dropdown ul li:first-of-type {
border:0;
}

#dropdown ul li:hover,
#dropdown ul li:active {
border-top-color: #656982;
border-bottom-color: #656982;
background-image: linear-gradient(to bottom, #dfe2eb 0%,#b9bfd7 49.9%,#a3aac7 50.1%,#a9adc8 100%);
}

#dropdown ul li:first-of-type:hover {
border-radius: 0.4em 0.4em 0 0;
}

#dropdown ul li:last-of-type:hover {
border-radius: 0 0 0.4em 0.4em;
}
}
</style>

</head>
<body>
<input id="chbx" type="checkbox">
<ul id="dropdown">
<li>
<label for="chbx">Cities</label>
<div>
<ul>
<li>Alaska</li>
<li>Arizona</li>
<li>California</li>
<li>Colorado</li>
<li>Conneticut</li>
</ul>
</div>
</li>
</ul>

</body>
</html>

...for design and we can work on it's functionality when we know what that might be. :D


coothead

theremotedr
01-09-2017, 05:19 PM
Evening,

Take this page for example http://www.theremotedoctor.co.uk/accaudi.html?scrollto=selection
I plan to keep the look of the web page version the same for PC & IPAD which shouldnt be an issue due to screen res properties etc.

The difference in appearance would be for mobile devices & maybe iphone only where other mobile devices would see the same as they do now.
On each web page you would see something like,


<li><a href="javascript:" onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','<b>£4.00</b><br>Fix That Damaged Remote<br>Easy To Swap Over<br><span class=noteColor>T5 & T6 Screwdriver Is Required</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><scan class=drColor>The Remote Doctor</scan>')">Flip Remote Key Pad</a></li>

<li><a href="javascript:" onclick="replaceMainImage('m-images/photos/AUDI006.png', 'Audi006','<b>£8.00</b><br>Key Will Require Cutting<br>Emergency Key<br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><scan class=drColor>The Remote Doctor</scan>')">Smart remote uncut key</a></li>

<li><a href="javascript:" onclick="replaceMainImage('m-images/photos/AUDI005.png', 'Audi005','<b>£8.00</b><br>Chip Will Require Programming<br>With Diagnostic Tool<br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><scan class=drColor>The Remote Doctor</scan>')">Virgin Can Bus Chip ID48</a></li>

<li class="licenter"><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" id="rmfb" target="_blank">Read My Facebook Feedback</a></li>
<li class="licenter"><a href="#home" id="rtm" class="scroll">Return To Menu</a></li>

This would be what is shown on the mobile device as represented by the image below.
6034

I am using this test page as we go along http://www.theremotedoctor.co.uk/accaudiiphone.html?scrollto=selection

Currently the iphone screen looks like this.

6035

coothead
01-09-2017, 05:42 PM
Hi there theremotedr,


I am finding it extremely difficult trying to find some sort
of connection between this...

6034

...and this...

6035


Also, you do not mention whether the code that I gave
you is a start in the right direction.

I do understand, of course, that it can take a little while
for us to start singing from the same hymn sheet.


coothead

theremotedr
01-09-2017, 05:54 PM
The first photo is what the screen should look like on the mobile.
With the code you supplied and installed the mobile looks like the second photo of which is a screen shot from the phone.

Is that clearer for you ?

theremotedr
01-09-2017, 06:18 PM
Coothead.
Im sorry phone was sleeping.

We are on the correct track.
See correct screen shot from mobile phone.

6036

coothead
01-09-2017, 06:46 PM
Hi there theremotedr,


so...

is the design close to your requirements?
does it work as you expected?
is it meant to interact with this...


6038

...in some way or other?



coothead

theremotedr
01-09-2017, 07:17 PM
The outcome would be something like this.

Currently i see this on the phone.
CITIES " we will call this header tab "

Then once you click on CITIES i see the following,
ALASKA ARIZONA CALIFORNIA etc etc " we will call this sub categories "

So with my layout it would be then like this.
HOME, SITE HELP, CONTACT,ACCESSORIES etc etc as shown on pc, " this would be the header tabs which currently is CITIES"
6039
Then once you make your selection say in this case ACCESSORIES as shown on pc, " this would be the sub categories which is currently ALASKA ARIZONA etc etc"
6040
You then click on one of the sub categories say in this case AUDI
The next sub category would as shown below,
6041

Clicking on one of these items would then load the relevant page like how it does at present.

With me on this ?

Basically as opposed to having the current selecting option on the phone in respect of horizontal buttons it would be just a fancy scrolling wheel.

Did i explain ok ?

coothead
01-09-2017, 10:49 PM
Hi there theremotedr,


check out the attachment to see a fully working test page.


coothead

theremotedr
01-09-2017, 11:02 PM
Hi,

The items under the ITEM SELECTION heading,can you just duplicate them into the code please.
I need to see what it looks like for when the list is longer.

I did just copy and paste it before asking but it just entered it as blue text & not like for like ?

i can then advise.

Cheers.

theremotedr
01-09-2017, 11:28 PM
Hi,
I now added some extra items for sell in the ITEM SELECTION list,
I am rubbish at explaining this so here goes again.

After adding extra items to the list the grey reel counter on the phone just extends down the page.
Imagine you have 20 items for sale BUT you can only see say 3 of them on the grey reel counter.
You need to spin the reel around one at a time etc so the items come into view.
Current set up there is no spinning animation just moves up the page.

I am trying to find a video demo etc to show you.
Basically a wheel on a axle,you can spin the wheel around the axle to then view the items that were currently hidden.

Sorry im rubbish at this.

theremotedr
01-09-2017, 11:32 PM
Take a look at this,fast forward to 02.16
https://www.youtube.com/watch?v=fm9Mw_IL2gw

Gives you some idea of how it works but put the animation in to code youve done so far.
With me ?

theremotedr
01-09-2017, 11:42 PM
Here is a better demo

http://stackoverflow.com/questions/33157307/how-to-make-a-html5-spinning-list-rotating-wheel-selector-picker

coothead
01-09-2017, 11:55 PM
Hi there theremotedr,


I have just spent 3 hours making a page to your specification.

The only comment that you can make about it is...


The items under the ITEM SELECTION heading,
can you just duplicate them into the code please.
I need to see what it looks like for when the list is longer.

Well, that is really encouraging.

So please do not ask me to go to stackoverflow, I would rather shove
a pointed stick somewhere where the sun never shines than go there.

Check out the attachment to see another fully working test page.



coothead

theremotedr
01-10-2017, 12:06 AM
I didnt mean to upset you but it obviously did.
I was looking for some guidance to advise it appearance etc.

No harm was meant after all that you have done,no point me doing that.
There was more comments / thanks to give you but i didnt mention it in that post as i was looking for something in its operation.

Thanks for all the effort that you have put into helping over the last few days & tonight 3 hours help.

theremotedr
01-10-2017, 12:24 AM
Not to upset you,i copied this from post 8
Basically as opposed to having the current selecting option on the phone in respect of horizontal buttons it would be just a fancy scrolling wheel.
Please dont take this the wrong way,i appreciate all the help/advice given.

theremotedr
01-10-2017, 06:49 PM
Coothead,
Good evening.

Cant we start with a new day today please.

coothead
01-10-2017, 10:37 PM
Hi there theremotedr,


I do not know if this will work on your iPhone.

But I am sure that you will tell me. :D


coothead

theremotedr
01-10-2017, 10:55 PM
Evening,

I see the grey bar with SELECTION to the left & click within a bubble to the right.
Pressing click does nothing at this stage.
Pressing SELECTION then shows a field now below.
If i press click i see,
Remote fob 2 button + Instructions.
Each time i press click the next item in the list is shown.
If you keep pressing click the list cycles in a loop.
Click on an item in the list then the page shows the item for sale.

See images below.

60456046


I have some points to make,ask,offer etc but will let you read the above first.
When you are ready give us a nod please.

Thanks very much for this work.

coothead
01-10-2017, 11:13 PM
Hi there theremotedr,


so am I now beginning to sing from the the same hymn sheet as you?


coothead

theremotedr
01-10-2017, 11:18 PM
After yesterday i would rather go with this as opposed it being put on the shelf.
There are a few things to address but im thinking are you doing the major stuff now then we tweak it to look & feel right afterwards.
Or shall i just say it now so we know where we are going and not having to make edits later which can be done now ?

Make sense to you ?
I think im on page 10 and you are on 9 at present.

coothead
01-10-2017, 11:29 PM
Hi there theremotedr,


I didn't want to change my original much until it's functionality was honed.

My guess was that you would not want the field to be hidden, but for me
it is easier to remove stuff than to put it back.

Of course there were a few other things that I thought you would want
changed or removed or replaced.



coothead

theremotedr
01-10-2017, 11:46 PM
In the grey bar where it shows Shell case 2 button CE0523 "this is the item for sale" i was thinking of having it say 3 deep where at present its just 1 deep.

Example.

Item 1 for sale
Item 2 for sale
Item 3 for sale

Now these 3 items in view should animate a rotating action/wheel turning on its own axis etc as opposed to it scrolling up the page.
Using your finger to scroll the wheel around you would see the following.

Item 2 for sale
Item 3 for sale
Item 4 for sale

Using you finger again,thus

Item 3 for sale
Item 4 for sale
Item 5 for sale

And also being able to go backwards from the above to the below.

Item 2 for sale
Item 3 for sale
Item 4 for sale

The middle item would be coloured/shaded like the current 1 line in use at present.
Make the outer 2 items a lighter grey giving the appearance of the middle line being the item which will be the selection choice.

Something like the photo shown below.
Disregard the year on it just looking at the Month & its styling appearance etc.

So the useR dont get carried away when scrolling only allow it to scroll say 1 field at a time so its like click,click,click as it rotates as opposed to wheeeeeeeeeeeee in one finger motion.
Actually if the clicking sound can be added it would be great, obviously if its to much work drop the sound.

When the customer has the item they wish to purchase in the middle line they just press it then the code loads the image like at present

This for iphone users is quite common so they will understand how it works.

SELECTION can stay in place and also the click button.
But as opposed to pressing the SELECTION to load this new scroll wheel change it so you press CLICK to load the scroll wheel.

DOES THIS MAKE ANY SENSE ????

6047

coothead
01-11-2017, 12:47 AM
...and how, exactly, am I meant do and test that?

As I have pointed out many times, I do not have mobile devices. :eek:

And I forgot to ask, do you think that your fob customers are at
all interested or impressed by any of this "arty-farty" nonsense?


coothead

theremotedr
01-11-2017, 12:58 AM
I thought you said in a post a few days ago that you did have a phone ???

Ok,leave that arty-farty stuff.

Can we proceed with this "Plan b"

Have the click button load the items for sale not the word selection.
If you tell me where in the code i can make an adjustment to the height of the field for where the items for sale are shown.


There was something else but cant remember at present.

If you could sort the Click job and show me the code for heigh i will do that now & think what else it was in the morning.


Thanks for your help this evening.

coothead
01-11-2017, 01:28 AM
Hi there theremotedr,



I thought you said in a post a few days ago that you did have a phone ???

No, what I actually wrote in this post...


Video player set up - post #30 (http://www.dynamicdrive.com/forums/showthread.php?80855-Video-player-set-up&p=320320#post320320)

...was...



I can test IE8 and Windows XP on an old steam driven machine no
problem but iPod, iPad, iPhone and Android are out of my reach.

I would have one of these devices if I could just use it for testing
purposes, but it seems that I have to have all the expenses that
go with these mobile devices.



I will reassess the problem after good dose of zzzzzzzzzzs



coothead

theremotedr
01-11-2017, 01:34 AM
Yep Good Night

theremotedr
01-11-2017, 02:52 AM
Before i went for my Zzzzzzzz i made a few slight edits.
Changed Click to Click Me.
Added a border radius & colour to the drop down part.

Changed Selection to Item Selection
Added border radius to the part where you see Item Select & Click Me.
I see what you did with the two split fields hence the request below.

When you alter the way the drop down is loaded from Item Selection to Click Me can you look into the vertical border between each of them.
I understand why its appeared but would like the radius to be shown.
See attached image.
Also attached this edited file.

If there is any problem with what i have done i still have the file you sent me so it can be put back no problem.

6048

coothead
01-11-2017, 11:35 AM
Hi there theremotedr,


I haven't looked at your revision as yet, as I've been busy working on mine.

check out the attachment to see my rough idea.

I have got to go out for a few hours, so I will not be available until late afternoon.



coothead

theremotedr
01-11-2017, 12:06 PM
Morning,
In your own time there is no rush.

Installed v3 and looking very nice,thanks.
The screen shot below is what i see.
6051

I understand this is a rough idea but just mentioning this for you.
When you land on this page the center selection would be the first in the list on pc.
So looking here http://www.theremotedoctor.co.uk/fachonda-mobile-test-version-3.html?scrollto=selection it would be Remote fob 2 button + instructions.
It actually lands on the second item Remote fob 3 buttons + instructions.

I also notice where ever you leave the selected item in the wheel say in this case Read My facebook etc when you land on the page later on as opposed to it resetting to the first item in the list its still on the last visited item.

I see to cycle the selections you need to press ITEM SELECTION.....
There is item that misses the selection middle view.

The culprit is Remote fob 3 button + instructions.

If you are on Remote fob 2 buttons + instruction then press ITEM SELECTION you should then now be on Remote fob 3 button + Instructions but it jumps and what you actually see now is Remote fob case 2 button.


Remote fob 3 button + instructions never lands on the center selection point.
See below,

60526053

Thanks very much for this version 3

coothead
01-11-2017, 05:45 PM
Hi there theremotedr,


Let's start with this...



I also notice where ever you leave the selected item in the wheel say in this
case "Read My Facebook" etc when you land on the page later on as opposed
to it resetting to the first item in the list it's still on the last visited item.



Well, that is normal behaviour.

Can you show me an example of a page reloading after opening another page?

I have amended, but not reinvented, the wheel.



coothead

theremotedr
01-11-2017, 06:17 PM
Hi,
This new file version 4 has fixed the issues below,

Just for ease & save my fingers we will say items for sale are 1,2,3,4,5,6,7,8
If say item 3 is in the selection line and i refreshed the page on the phone etc it should now show item 1 in the selection line BUT it was still on 3.
"you have now fixed this" each refresh now starts the code again and item 1 is shown on the selection line.

When you land on the page the first item for sale is now shown in the selection line.
Before it did not.
"you have now fixed this"

When you cycle through the items for sale it should be like 1,2,3,4,5,6,7,8 each digit on the selection line.
Before it would be 1,3,4,5,6,7,8
"you have fixed this" each item for sale now takes its turn to line up on the selection line.

What i mentioned in my post this after noon has now been fixed.

Thanks very much.
Now to proceed when you are ready.

coothead
01-11-2017, 11:41 PM
Hi there theremotedr,


version 4, although appearing to work in your eyes it had a few problems
that were caused by various settings in your "basic.css" file.

This does not mean that there is anything wrong with the file, though.

After, quite a bit of searching I tracked down the the offending code
and consequently the new version is more robust and independent.

Check it out, and let me know what you think needs to be adjusted.

theremotedr
01-12-2017, 12:03 AM
Hi,
Thanks for this.

Looks & works fine.

How would a customer know that they needed to press ITEM SELECTION.... each time in order to scroll through the items for sale ?
Would like to see the ITEM SELECTOR have a splash of #0099FF & maybe even the 3 field scroller a touch of colour to match / blend in with the page.


If you were a customer what would you like or expect to see ?

Thanks for this it makes the phone look much better and up to date.

coothead
01-12-2017, 03:05 AM
Hi there theremotedr,



How would a customer know that they needed to press ITEM SELECTION


I do not actually know how a mobile device works with regard
to web page activity, other than it appears that there are,
from what I have noticed, always fingers or thumbs involved
in the operation of it's many mysteries.

So, with that in mind, I have changed "ITEM SELECTOR" to
"CLICK SELECTOR" to be on the safe side.

Of course, "CLICK" may be totally meaningless to users.

Anyway you can always change it to "THUMB SELECTOR"
or perhaps "FINGER SELECTOR", if that is not too risqué.


If you were a customer what would you like or expect to see ?

Well, as a septuagenarian and a potential key fob purchaser
I would want the navigation to the part that I required to be
as uncomplicated and as direct as possible.

If I was thirty or forty years younger then my views would
probably be entirely different.

You may not be aware that I just code this stuff for the
mental stimulation that it provides rather than for any other
practical purposes.

Have a look at version 6 which has colour changes.


coothead

theremotedr
01-12-2017, 10:40 AM
Morning Coothead,and other members.

Thats pretty nice what we have so far & thanks for setting this up.
I think the below is now needed and we are done.

I would like when the ITEM SELECTION button is pressed to hear a click sound,might be a daft request but i feel it gives the user a feel of rotation,if that makes sense.
Im currently looking for a click sound file etc.

I would think it has to be the same sound file but different formats like mp3 .wav .ogg .mp4 to support the users browser being used.

theremotedr
01-12-2017, 10:56 AM
Hi,

How about this,

<!DOCTYPE html>
<html>
<body>

<audio controls>
<source src="http://www.theremotedoctor.co.uk/sound-file/click.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

</body>
</html>

coothead
01-12-2017, 11:38 AM
Hi there theremotedr,


see if this works.


coothead

theremotedr
01-12-2017, 12:06 PM
Hi,

File updated & works a treat,many thanks i think we are now done.
Please can you update the version 6 + click file at your end,

From this,

#special-items span {
display: block;
width: 100%;
height: 3em;
line-height: 3em;
margin-bottom: 0.5em;
border: 0.06em solid #000;
border-radius: 0.75em;
box-sizing: border-box;
text-indent: 1em;
font-weight: bold;
color: #1e1e1e;
background-color: #09f;
box-shadow: 0.25em 0.25em 0.25em rgba(0,0,0,0.6);
cursor: pointer;

To This,

#special-items span {
display: block;
width: 100%;
height: 3em;
line-height: 3em;
margin-bottom: 0.5em;
border: 0.06em solid #000;
border-radius: 0.75em;
box-sizing: border-box;
text-indent: 1em;
font-weight: bold;
color: #1e1e1e;
background-color: #09f;
box-shadow: 0.25em 0.25em 0.25em rgba(0,0,0,0.6);
cursor: pointer;
background-image: url('http://www.theremotedoctor.co.uk/m-images/dr-scroll-picker.png');
background-repeat: no-repeat;
background-position: 97% 3px;

Also this,

<span id="butt">CLICK SELECTOR...</span>

To this,

<span id="butt">CLICK FOR OPTIONS...</span>


I understand now that i need to update all my pages.
Do you need to move anything from this test file into separate css file etc etc.

Please advise what steps i now need to make so my pages are then complete.

coothead
01-12-2017, 12:23 PM
Hi there theremotedr,


I will place all the necessary CSS and Javascript into external files for you.

This will mean that you will only have to edit the HTML

I have to go out now, so will return to it later this afternoon.



coothead

theremotedr
01-12-2017, 12:34 PM
Ok,
I await the next reply.

Thanks very much for all this help,i appreciate it.

coothead
01-12-2017, 07:44 PM
Hi there theremotedr,


Check out the attachment. ;)


coothead

theremotedr
01-12-2017, 08:21 PM
Evening,
I will start this now.

Two questions please,

Did you see post #39 & is it included in this update file you just sent me ?

I assume by adding this new coded to all the page in question "items for sale" then the pages without items for sale "like link supplied below" will just show like it was before we started this mobile option ?

http://www.theremotedoctor.co.uk/honda_programming.html?scrollto=content

coothead
01-12-2017, 08:56 PM
Hi there theremotedr,



Did you see post #39 & is it included in this update file you just sent me?
Yes and yes.

Only pages to which you amend the HTML for mobiles will be affected
even if you have added the script link to the bottom of the document.

But to avoid any javascript errors I have amended the file to allow for
this possibility.

Replace the the "mobileOptions.js" file that
I gave you for the one in this attachment.


coothead

theremotedr
01-12-2017, 09:06 PM
Thanks,

I will now continue.
have a good night & cheers for this.

Will report back tomorrow now.

theremotedr
01-12-2017, 10:29 PM
Hi,
Coothead.
I just relised that some pages do not have a scrolling marquee,like this page here.
http://www.theremotedoctor.co.uk/acclexus.html?scrollto=selection

So with the section of code below can you advise the correct code please,

</ul>
<br>
<h2>
<script src="js/neon/neonlights.js"></script>
</h2>

</nav>
</aside><!-- #end left sidebar -->

The page we were working on did have hence your code in the txt file,

</ul>
** need to do above **

<div id="cover-top"></div>
<div id="cover-bottom"></div>
</div>
</li>
</ul>
<audio id="click-sound" class="mobile-thing" controls>
<source src="sound-file/click.mp3" type="audio/mpeg">
</audio>
<!-- ****************************************************->
<div id="marquee">
<p>IF UNSURE JUST SEND ME YOUR CHASSIS-VIN NUMBER FOR ME TO ADVISE YOU.</p>
</div>
**DONE BELOW**
<br>
<h2>
&nbsp;<script src="js/neon/neonlights.js"></script>
</h2>
</aside><!-- #end left sidebar -->

Make sense ?

coothead
01-12-2017, 11:11 PM
Hi there theremotedr,


it does no make any difference if a page has a scrolling marquee or not.

If the page has one, it is displayed on the mobile device, if it does not
then there will be, obviously, nothing to display on the mobile either.

The code for the "acclexus.html" file in question would be this...



<!-- left sidebar -->
<aside id="selection">
<h2 class="pc-thing">ITEM SELECTION....</h2>
<div id="google_translate_element"></div>
<nav id="secondary-navigation" class="pc-thing">
<ul>
<li><a href="javascript:" onclick="replaceMainImage('m-images/photos/LEXUS003.png', 'Lexus003','<b>£8.00</b><br>Key Will Require Cutting<br>Emergency Key<br><span class=noteColor>Same Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 1 uncut key</a></li>
<li><a href="javascript:" onclick="replaceMainImage('m-images/photos/LEXUS004.png', 'Lexus004','<b>£8.00</b><br>Key Will Require Cuttingh<br>Emergency Key<br><span class=noteColor>Different Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 2 uncut key</a></li>
<li class="licenter"><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" id="rmfb" target="blank">Read My Facebook Feedback</a></li>
<li class="licenter"><a href="#home" id="rtm" class="scroll">Return To Menu</a></li>
</ul>
</nav>
<!-- **** mobile phone code **** -->
<ul id="special-items" class="mobile-thing">
<li>
<span id="butt">CLICK FOR OPTIONS...</span>
<div id="ul-holder">
<ul>
<li><a href="#home">Return To Menu</a></li>
<li onclick="replaceMainImage('m-images/photos/LEXUS003.png', 'Lexus003','<b>£8.00</b><br>Key Will Require Cutting<br>Emergency Key<br><span class=noteColor>Same Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 1 uncut key</li>
<li onclick="replaceMainImage('m-images/photos/LEXUS004.png', 'Lexus004','<b>£8.00</b><br>Key Will Require Cuttingh<br>Emergency Key<br><span class=noteColor>Different Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 2 uncut key</li>
<li><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" target="blank">Read My Facebook Feedback</a></li>
<li><a href="#home">Return To Menu</a></li>
<li onclick="replaceMainImage('m-images/photos/LEXUS003.png', 'Lexus003','<b>£8.00</b><br>Key Will Require Cutting<br>Emergency Key<br><span class=noteColor>Same Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 1 uncut key</li>
<li onclick="replaceMainImage('m-images/photos/LEXUS004.png', 'Lexus004','<b>£8.00</b><br>Key Will Require Cuttingh<br>Emergency Key<br><span class=noteColor>Different Groove Each Side Of Key</span><br><b>UK Recorded £2.50</b><br><b>International Signed For £10.00<br></b><b>Posted From The UK</b><br><span class=drColor>The Remote Doctor</span>')">Smart remote type 2 uncut key</li>
</ul>
<div id="cover-top"></div>
<div id="cover-bottom"></div>
</div>
</li>
</ul>
<audio id="click-sound" class="mobile-thing" controls>
<source src="sound-file/click.mp3" type="audio/mpeg">
</audio>
<!-- *************************** -->
<h2>
&nbsp;<script src="js/neon/neonlights.js"></script>
</h2>
</aside><!-- #end left sidebar -->


coothead

theremotedr
01-13-2017, 12:01 AM
Hi,
Im working my way throughj and this is the first completed page.
http://www.theremotedoctor.co.uk/accaudi.html?scrollto=selection

On the mobile when i click on CLICK FOR OPTIONS nothing happens.
In the code i also see this below in yellow at line 196

<aside id="selection">

Look on W3c it looks ok ?
http://validator.w3.org/i18n-checker/check?uri=www.theremotedoctor.co.uk%2Faccaudi.html%3Fscrollto%3Dselection#validate-by-uri+

coothead
01-13-2017, 12:13 AM
Hi there thereremotedr,


this...

http://www.theremotedoctor.co.uk/js/mobileoptions/mobileOptions.js

...gives a 404, and there is no sign of a mobileoptions folder in the js folder.

That will do for starters.


coothead

theremotedr
01-13-2017, 12:27 AM
Sorry my mistake,

Ive now added that file and when i click it cycles.

There is no click sound.
In#39 i mentioned that i added a long which sits on the same line as the CLICK FOR OPTIONS line,i do not see that either.

I will continue and see if you can spot why.

Thanks very much.

coothead
01-13-2017, 12:32 AM
Hi there theremotedr,


whilst waiting for you to install the javascript, I corrected and validated your page.

I have attached the file for you.




coothead

theremotedr
01-13-2017, 12:45 AM
Hi,
What did you do as still no click sound ?

coothead
01-13-2017, 01:00 AM
Hi there theremotedr,


when you say that the "click sound" is not working are you just referring to the iPhone?

I ask that , because it is working on all my p.c. browsers.


coothead

theremotedr
01-13-2017, 01:07 AM
Yes,
It was working fine this afternoon when i checked it.

This Html is also getting me knackered.
I have more yellow than i like to see but why ??????????

theremotedr
01-13-2017, 01:24 AM
the only sound file location is in our test pages.
Where would it be in the css etc or otherwise ?

coothead
01-13-2017, 01:32 AM
Hi there theremotedr,



It was working fine this afternoon when i checked it.

Well, the code has not been altered and the page has been validated successfully...


https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Faccaudi.html%3Fscrollto%3Dselection


I have more yellow than I like to see but why ??????????

I do not understand this yellow sighting.
Can you explain

While I am here:-

There are two coding errors - ( by me not you ) - in the "latestChanges" file


line #110 : background-image: 0;
this should be background-image: none;
line #191 : 30.1% {top: -100%; z-index:0;l} this
should be 30.1% {top: -100%; z-index:0;}


Also note that in the HTML you have various elements called
scan - <scan> that should be span - <span>.

They are all to be found in the onclick=".... parts of the code
which are going to be converted for the mobile phone.



coothead

coothead
01-13-2017, 01:43 AM
Hi there theremotedr,




the only sound file location is in our test pages.
Where would it be in the css etc or otherwise ?


The audio player is hidden form view by this css on line #123...



#click-sound {
position: absolute;
left: -999em;
}

...in the latestChanges.css file.

If you comment it out like this...



#click-sound {
/*position: absolute;
left: -999em;*/
}
..you will be able to see it on you mobile, and visually check that it is playing.



coothead

theremotedr
01-13-2017, 02:06 AM
I have now made the edits as advised.
Strange about the mp3 spound.
It plays on the pc fine so i am getting another mp3 to see if any difference.
Also restarting the phone.

The yellow i mention is in dreamweaver it advises you of an error.

This html has had me beat,before i started to edit it all i made a copy.
Ive now deleted all that i have done and will start again.

coothead
01-13-2017, 02:13 AM
Hi there theremotedr,


Dreamweaver, oh dear, oh dear.
Did you actually buy it?
Oh dear, oh dear, oh dear.


coothead

theremotedr
01-13-2017, 02:23 AM
No i never.

I have restarted the phone and used another file now sound is back.

can you advise what to use if DW is so bad ?

theremotedr
01-13-2017, 03:17 AM
Hi,
Before i go to bed 03:10 i thought i would try another file.
The file in question is here http://www.theremotedoctor.co.uk/accbmw.html?scrollto=selection

I am sure that ive done it to the letter BUT yet again i see the following in yellow in DW

<aside id="selection">
In line 192

This is the yellow marker i was talking about.
6061

Can you send a screen shot of where the problem is,as hard as it may seem i dont think its possible even for me to make the same mistake twice :cool:
Dont correct it but just advise.

Many thanks and good night i mean morning.

coothead
01-13-2017, 11:12 AM
Hi there theremotedr,


Preamble

I started coding in 2003 and I used "Windows notePad" which came "in-the-box".
It was simple and did the job.
What I typed was what I got.
It did not examine my code or point out errors.
For me, as a beginner this was ideal.
If I made a mistake I had to find it myself.
Making errors and correcting them made my coding skills stronger.
During this early period I discovered coding forums.
The idea of helping others appealed to me.
So I started trying to solve their coding problems also.
These exercises made my coding skills stronger.
Some coding errors were very difficult to locate.
I discovered a tool that would help - https://validator.w3.org/
For me these two tools were all that I needed to produce solid workable code.
A year or so ago I did find that "Windows notePad" had one serious flaw.
It could note save a file as UTF-8 without BOM.
So I added Notepad++ (https://notepad-plus-plus.org/) to my toolbox.

If I had started with "Dreamweaver", then I probably would not be coding today.

End Preamble


Can you send a screen shot of where the problem is...
No, that would not help as eyes don't easily spot the errors

Instead I can do better than that, my reliable tool will point them out to you...


Validation results for theremotedoctor.co.uk/accbmw.html (https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Faccbmw.html%3Fscrollto%3Dselection)



coothead

theremotedr
01-13-2017, 11:33 AM
Hi there theremotedr,


Preamble

I started coding in 2003 and I used "Windows notePad" which came "in-the-box".
It was simple and did the job.
What I typed was what I got.
It did not examine my code or point out errors.
For me, as a beginner this was ideal.
If I made a mistake I had to find it myself.
Making errors and correcting them made my coding skills stronger.
During this early period I discovered coding forums.
The idea of helping others appealed to me.
So I started trying to solve their coding problems also.
These exercises made my coding skills stronger.
Some coding errors were very difficult to locate.
I discovered a tool that would help - https://validator.w3.org/
For me these two tools were all that I needed to produce solid workable code.
A year or so ago I did find that "Windows notePad" had one serious flaw.
It could note save a file as UTF-8 without BOM.
So I added Notepad++ (https://notepad-plus-plus.org/) to my toolbox.

If I had started with "Dreamweaver", then I probably would not be coding today.

End Preamble


No, that would not help as eyes don't easily spot the errors

Instead I can do better than that, my reliable tool will point them out to you...


Validation results for theremotedoctor.co.uk/accbmw.html (https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Faccbmw.html%3Fscrollto%3Dselection)



coothead

That explains a bit because i use this but shows a differenr page that what you supplied.
So i do actually use the W3 link but then its the wrong one,se image
6063

coothead
01-13-2017, 12:06 PM
Hi there theremotedr,


this...


https://validator.w3.org/i18n-checker/

...is not a code validator whereas...


https://validator.w3.org/

...is. :D

If you are using Chrome or Firefox for code testing, then I would suggest that you get this extension/add-on...


Web Developer (http://chrispederick.com/work/web-developer/)

...it has many invaluable tools, including HTML and CSS validation, both local and external.

When I code I don't wait until I have finished a document to check the code for errors.

I always do it as I proceed which is much easier.



coothead

theremotedr
01-13-2017, 07:42 PM
Hi,
Ive added that plug in,thanks.

Now looking at this https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Faccbmw.html%3Fscrollto%3Dselection

First on the list is,

<nav id="topnav" role="navigation">

I copy it from your Audi file you sent ,changed and uploaded but still see the problem ?

Another thing would be if i am following the txt doc you sent why am i having all the issues,im not saying obviously its you BUT why am i facing this issues.
I dont say 5 pages last night and each page was the same.
Using this add on i dont want to edit here & there, i need to find out why at first what im doing is wrong.

This is where i come unstuck,i went to be at 4am this morning.

coothead
01-13-2017, 08:27 PM
Hi there theremotedr,



Warning: The navigation role is unnecessary for element
As it says, it is a just a warning, leave role="navigation" in or remove it.

Why did you put it in, what purpose do you think it serves?

If you don't know remove it, I do every time that I validate your code.

As for the items marked as error the validator is saying
that your coding is either totally incorrect or bad.

These issues must be addressed no argument.

If a page has a functional problems, it can be because of coding and/or methodology.

Validation helps to isolate the problem.

If your coding journey had been, in a way similar to mine, you would now possess a
much better understanding of coding methodology.

Unfortunately, considering "Dreamweaver" to be coding asset was your major mistake.



coothead

theremotedr
01-13-2017, 09:06 PM
Hi,
I will be honest,i am finding this really hard.
role="navigation" now removed

To make it easier for me ive just copied the code from the audi on to "x" amount of pages regardless if they are bmw ford etc & then tomorrow i will edit the mobile code correctly.

Here is one page for you to look at please http://www.theremotedoctor.co.uk/accnissan.html?scrollto=selection
Just checked this page on the phone and even though just by eye it looks ok the click to rotate does not function.

coothead
01-13-2017, 09:45 PM
Hi there theremotedr,


a brief look at your HTML indicates that the document is missing this...



<script src="js/mobileoptions/mobileOptions.js"></script>


coothead

theremotedr
01-13-2017, 10:13 PM
Sorry about that,
I didnt put it in all the pages originally as some didnt require it,i changed my mind and now forgot to add it.

A couple of questions please.

I have noticed something would the click sound.
It sounds / feels like you must wait for the click to make the sound before pressing the button again,makes sense ?
If you say press click click click click click you dont hear the sound for each press.
Whether the sound file is to long or not im not sure but need to look.
Failing that can anything be put in place or how do we tackle it ?


As im doing this edit bit by bit & correcting it as i go,not being a full shilling i can only see its working when i upload.
Obviously everyone else can then see my work in progress which doesn't look good for my page etc or me "ha ha" so can i view a page before its uploaded for real.
Like a demo version of what will happen etc for when i do upload it.
Do you know of such site where you could select say Firefox Chrome Ipad etc etc ?

Thanks for the help once again & off to be now,4am is starting to remind me.......

coothead
01-13-2017, 11:09 PM
Hi there theremotedr,


I forgot to mention that I amended the script, a day or two ago, to reset
the audio after each click.

Check out the attachment for the amended file.

You do not have to upload a file to your site to view it.

If the file has this...



<base href="http://www.theremotedoctor.co.uk/">

...in it, then it can be viewed locally in your Chrome or Firefox browser.

I use Firefox for my initial testing because it has "Responsive Design Mode"
as an extremely useful built-in tool.

This enables me to see how a page might appear on a mobile device.

I notice that you have not removed hspace="5" from here...


http://www.theremotedoctor.co.uk/accnissan.html

Their removal has been accounted for with this...



footer img {
margin: 0 0.1em;
}

...in your "latestChanges.css" file.

theremotedr
01-13-2017, 11:55 PM
Hi,
Tomorrow I will install this updated file.
Hspace also a job for the weekend, just delete it.

Additional question,but I haven't thought about yet & maybe not sure if it's relevant.
With the mobile code, it's a duplicate of the original already in place where it loops you have to added the same file etc etc.
On some pages this is fine where you have say 8 items for sale including Facebook & return to menu etc.
But what about a page that only has 3 items in total,
1 item for sale
Facebook
Return to menu
Is there an issue you see for when I'm doing these pages in respect off using the duplicated files to create that loop ???
Like this page http://www.theremotedoctor.co.uk/accfiat.html?scrollto=selection
How will it look on the scroll wheel as it's got limitations.

Thanks for your time with all this.

coothead
01-14-2017, 12:26 AM
Hi there theremotedr,


obviously, three items is the minimum number that you can have for a three-wheel-display.

The procedure is exactly the same, add the last to the top and add the first two to the bottom.

I have done that for your "accfiat.html" file and validated it.

You can find it in the attachment.

Note

When looking for the source of a problem I added id="foobar" here...



<span id="butt">CLICK FOR OPTIONS...</span>
<div id="ul-holder">
<ul id="foobar">
<li><a href="#home">Return To Menu</a></li>

...and forgot to remove it.

You can safely remove it from all of your documents.


coothead

theremotedr
01-18-2017, 11:05 AM
Hi,
I am slowly working through this but at present its seconds job in line due to my work.

I have on my site as you know these social media icons that "get in the way so to speak" but a customer has informed me that his screen resolution is 1024 x 600 & they hog his screen.
I need these on there but agree with him,
Please see image he took from his phone.

6066

Ive also noticed that the tab header OTHER is on the second line,
Can this be address by adding the correct media query of which i am rubbish at believe it or not :D

coothead
01-18-2017, 11:31 AM
Hi there theremotedr,


I have mentioned the obtrusive nature of those awful social media icons before,
and cannot, for the life of me, understand why you would want to let them be
so invasive to your site.

Here again, I think you have been sucked into another example of what I like to
call "arty-farty" nonsense to the detriment of your site.

What do you actually think is wrong with placing normal links with smaller icons
in a more suitable and professional position?



coothead

theremotedr
01-18-2017, 11:45 AM
Ok,
I will remove the code for them

Thanks again.

theremotedr
01-28-2017, 07:48 PM
Hi,
Could you be so kind as to advise why i have a few problems.

When scrolling through the field "RETURN TO MENU" IS MISSED
http://www.theremotedoctor.co.uk/accmitsubishi.html?scrollto=selection

No scrolling takes place.
http://www.theremotedoctor.co.uk/accporsche.html?scrollto=selection

Lands on second item for sale not first.
http://www.theremotedoctor.co.uk/accrangerover.html?scrollto=selection

I then think with your input i can continue & fix myself ?

coothead
01-28-2017, 08:40 PM
Hi there theremotedr,


you are probably just suffering from coding exhaustion. :eek:

I have made all the necessary adjustments and popped
your three files into the attachment.



coothead

theremotedr
01-28-2017, 08:45 PM
Evening,
To be honest i have really struggles with this part.
I have done so far only say 12 pages.


Can you,when you get time,point out where i went wrong because there are a couple of pages also like the above supplied links.

Thanks.

coothead
01-28-2017, 08:53 PM
Hi there theremotedr,


you just appeared to forget the mobile sequence.

If you make a list of the pages that still need to be done,
I will go through them for you as and when I get the time,

This will probably only take a few days.



coothead

theremotedr
01-28-2017, 09:41 PM
Coothead,
That is very kind of you once again.
I have made no real impact on the site which is very poor but I'm trying to do it.
I actually sometimes sit looking at the same thing for 15 minutes & then give in until the next day.
Some 12 pages I've done out of say 80 which was about 1 week.

I would like to continue with a few more but here is a question for you.

1, Should i supply the pages untouched for you ?
2, Should i continue but the send the pages for trouble shooting/correcting etc ?

I was concerned about which would be quicker for you ?

I appreciate your help & i am in no rush so as & when it's ok for you.
Many Thanks.

coothead
01-28-2017, 09:50 PM
Hi there theremotedr,


just supply links to the all the relevant pages as you did in post #76.

I will then do the necessary amendments and return them to you in an attachment.



coothead

theremotedr
01-29-2017, 01:55 PM
Ok
I will do a few at a time and the issue pages i will put here.

Thanks very much for the offered help.

coothead
01-29-2017, 02:14 PM
Hi there theremotedr,


I have done three files already....


accford.html
acchonda.html
accjaguar.html

..and am just starting ...accmazda.html



coothead

theremotedr
01-29-2017, 02:30 PM
OK
Thanks,im away at present but will be back on Tuesday.

coothead
01-29-2017, 02:38 PM
Catch you later. :)


coothead

DyDr
01-29-2017, 03:34 PM
Sorry to jump in here, but manually producing and editing .html files, unless you are doing this as part of a touch-typing course :D , is something that went out of style in the 1990's, and is error prone, time consuming, and must be redone every time you make any change to the layout/operation or information on the web site.

You need to use a server-side scripting language (PHP is a good choice since it is fairly intuitive) to dynamically produce the navigation and the unique content on the pages and have a single html template that gets populated with the dynamic navigation and content. This will save all the editing you are doing.

This may require a bit of learning to accomplish, but you would end up spending your time making page layout/operational changes to only one instance of the page template, maintain the car make and accessory information in database table(s), and have some fairly simple php code and sql queries to retrieve the data needed to produce any page, rather than spending a ton of time just beating on a keyboard doing repetitive work that you can get the computer to do for you.

theremotedr
01-30-2017, 01:26 AM
You will notice that Accessories,Fobs & Cases have pretty much been done.
You may also have noticed that NONE have been touched if there is a scrolling marquee on the page.
I think from memory that there is only then Keys & Remotes to work through.

Then of course I will go through every page to check the following.
Landing on the page the 1st item is selected with the blue selector.
Each page scrolls in order of items as per pc version.

Fun ahead I can see.

theremotedr
01-30-2017, 01:29 AM
Sorry to jump in here, but manually producing and editing .html files, unless you are doing this as part of a touch-typing course :D , is something that went out of style in the 1990's, and is error prone, time consuming, and must be redone every time you make any change to the layout/operation or information on the web site.
F
You need to use a server-side scripting language (PHP is a good choice since it is fairly intuitive) to dynamically produce the navigation and the unique content on the pages and have a single html template that gets populated with the dynamic navigation and content. This will save all the editing you are doing.

This may require a bit of learning to accomplish, but you would end up spending your time making page layout/operational changes to only one instance of the page template, maintain the car make and accessory information in database table(s), and have some fairly simple php code and sql queries to retrieve the data needed to produce any page, rather than spending a ton of time just beating on a keyboard doing repetitive work that you can get the computer to do for you.

Hi,
Not sure if you've looked at my sight but each page is different.
So I think that what we are doing is correct & don't see it as time consuming.
I've had good help along the way so I wish to continue with the way we started.
Thanks for the input anyway.

coothead
01-30-2017, 01:32 AM
Hi there theremotedr.



I have done 35 files. ;)

You can get them here...


amended-files.zip ( http://www.mediafire.com/file/t1xyf6t2xp78vw6/amended-files.zip)



coothead

theremotedr
01-30-2017, 01:23 PM
Afternoon,
I have emailed my brother who has uploaded the files to the site.
This afternoon i will check through them and advise.
Not that you did any wrong im sure but i did ha ha

See you later.

Many thanks for this.

theremotedr
01-30-2017, 06:17 PM
Evening all,

Thanks very much for your work,i would be still doing it myself for another week..

I have noticed the items shown below.

Upon landing this page the words Return To Menu is centered not left.
http://www.theremotedoctor.co.uk/accford.html?scrollto=selection
6083

The pages below when scrolling have the Return To Menu miss out its turn of the middle blue line.
http://www.theremotedoctor.co.uk/accnissan.html?scrollto=selection
http://www.theremotedoctor.co.uk/accrangerover.html?scrollto=selection
http://www.theremotedoctor.co.uk/facfiat.html?scrollto=selection
http://www.theremotedoctor.co.uk/facsparkrite.html?scrollto=selection

The item below when landing on the page shows Smart remote type 2 in the middle line where it should be Smart remote type 1
Also Smart remote type 1 miss out its turn of the middle line.
http://www.theremotedoctor.co.uk/accvolvo.html?scrollto=selection

The page below shows Read my facebook page is out of line,and also out of line when scrolling.
http://www.theremotedoctor.co.uk/karlandrover.html?scrollto=selection
6084

Many thanks,
Out for tea then have a look in a while before the drive home.

coothead
01-30-2017, 07:48 PM
Hi there theremotedr,


check out the attachment. :D


coothead

theremotedr
01-31-2017, 12:56 AM
Super job thanks very much.
Looks great & tomorrow will take a closer look.

I did see something we need to look at.
Can't remember 100% but it was along the lines of the pages with the scrolling marquee message on.
Something like the last item in the ITEM SELECTION list then had a large gap before the scrolling marquee.
I think pages that didn't have the scrolling marquee on just looked normal.
Writing this from memory but close I think,will need to look on pc later on.

Thanks once again.

theremotedr
01-31-2017, 10:17 AM
Morning,

Site looking great with your input once again.

Last night i mentioned about an issue i had seen & below is the issue.

This page below has the correct look in respect to the last item in the list & then the scrolling marquee.
http://www.theremotedoctor.co.uk/honda_programming.html?scrollto=content

This page below however has a large gap between the two.
http://www.theremotedoctor.co.uk/facford.html?scrollto=selection

There are about 25 pages like this so if you could point me in the correct direction i will edit them.

Many thanks.

theremotedr
01-31-2017, 10:30 AM
Ok,
Its a bit confusing BUT,
Not all pages have a scrolling marquee,like this page,
http://www.theremotedoctor.co.uk/accaudi.html?scrollto=selection

Not all pages have items for sale but do have a scrolling marquee,like this page.
http://www.theremotedoctor.co.uk/civic.html?scrollto=content

Maybe best to add a scrolling marquee to the pages that dont currently have one BUT if that page doesnt have the mobile thingy as you call it i assume there will be no gap & just next to the last item in the list correct ?
If so can we create that dummy gap just so to the eye all look the same,what do you think ?

Thanks

coothead
01-31-2017, 11:07 AM
Hi there theremotedr,


I have found the solution to the problem, but I have got to go out until mid afternoon.
It will be easier if I amend the files for you when I get back.


coothead

theremotedr
01-31-2017, 11:28 AM
Yep no problem.
No rush at all


Thanks.

coothead
01-31-2017, 03:58 PM
Hi there theremotedr,


you were exactly right about the number of files. :D

Download them here...


~ 25 ~ (http://www.mediafire.com/file/nn8m7jl54zr1wpw/25.zip)

If you are interested, the problem was the result of my failing
to create a "marquee" for both desktop and mobile. :eek:



coothead

theremotedr
02-02-2017, 12:47 PM
Afternoon,
I have applied those files & checked the pages,all look spot on now.

There is one thing i would like to ask since making these changes "possibly" as something has now stopped working.
A customer would say come to this page http://www.theremotedoctor.co.uk/kars2000.html?scrollto=selection
They then select from ITEM SELECTION "S2000 Upgrade to an all in one remote"
The photo is then loaded so they then select the CLICK TO ORDER button.
You are they taken here http://form.jotformeu.com/form/62115565434352?partNumber=Honda044
The customer would then complete the form & then select the SUBMIT button.

I should then receive the completed form in my email like shown below.
6091

Now the problem is this.
There is NO link now shown to the right of "Link To Part Number" anymore.
The link in this case would be this & when i click on it also send me to the page http://www.theremotedoctor.co.uk/m-images/emailref/Honda044.html

Do you see anything that has been changed that would stop the link from being inserted into the field.
The site where i use the form etc there was nothing ever in place for it to put the link in for me.
It was always done within the code on each of my pages.

Many thanks.

The image example supplied above was submitted to me 31/1/2017 if that helps.
This i believe is the same for each page but unable to check unless i send myself several completed forms.

coothead
02-02-2017, 02:30 PM
Hi there theremotedr,


I have submitted a test form for your inspection from
the pc page and the mobile page.

If there is a problem with the form submission process
then it may be a good idea to take it here...


JotForm Support Forum (https://www.jotform.com/answers)



coothead

theremotedr
02-02-2017, 04:37 PM
Hi,
Ive replied,thanks.
Now looking at the link you supplied.
I did contact them but no help.

As a test i will upload an old html file before this new edits were made and see what the score is.

Be back soon.

theremotedr
02-02-2017, 05:49 PM
Hi,
I have used a file from my back up source December 2016 & it also does not put the code into that field.
I also checked the code from that file to the current in use file and it is spot on character for character so all fine there.

The screen shot that i supplied was received working to me January 20th.
I have asked the question at Jot form to see what they say.

theremotedr
02-03-2017, 10:02 AM
Url issue now sorted.
That form site is one of those places where you just add code to center some text yet it decides to also remove a photo on its own.
Hard to believe i know but it does.

Rounding off this post a question for you.

Take these 2 pages for example.
http://www.theremotedoctor.co.uk/accford.html?scrollto=selection "Has a scrolling marquee"

http://www.theremotedoctor.co.uk/accfiat.html?scrollto=selection "No scrolling marquee as such"

I thought that should i need to add a scrolling marquee to pages in the future what would i need to add etc.
Looking at the Ford code i copied the following & put it into the Fiat code page.

<div id="marquee" style="margin:0">
<p>KEY CLONING SERVICE AVAILABLE.</p>
</div>

I just checked the Fiat page & to my surprise it is working ?
I say that because on the Ford page i see the following where i havent even put that yet on the Fiat page.

<!-- Scrolling Text Start-->

<style media="screen">


#marquee {
height: 2.5em;
border-radius: 1em;
border: 0px solid #5d0e13;
box-shadow: 0.25em 0.25em 0.5em #000;
overflow: hidden;
background-color: #66c2f1;
}

#marquee p {
width: 20em;
line-height: 3.5em;
margin: 0;
font-size: 0.8em;
font-weight: bold;
white-space: nowrap;
animation: marquee 12s linear infinite;
}

@keyframes marquee {
0% {margin-left: 100%;}
100% {margin-left: -20em;}
}
</style>
!-- Scrolling Text End-->

So is this code needed or redundant.
Please advise.

Many thanks for your help.

coothead
02-03-2017, 11:39 AM
Hi there theremotedr,


when I amended those "25" files in post #98 I forgot to check them for validation.

Unfortunately, repeating the "marquee" also repeated the "id".

So I had to amend the code to "class"

Download them here...


~ validated-25 ~ (http://www.mediafire.com/file/2mchuvxmpafaz23/validated-25.zip)

I apologise for the inconvenience that this may cause you :eek:

Now to answer your latest problem.

When the first marquee was created, it's CSS was placed in the
"latestChanges.css" file where it still remains.

But you discovered that it did not work for vaious lengths of text.

So you started placing individual css in the actual pages.

But I have now changed #marquee to .marquee in the all the
HTML pages.

If you still wish to keep it in the "latestChanges.css" file,
then you have to change the '#' to '.'.

I hope that this will help. :D



coothead

theremotedr
02-03-2017, 11:53 AM
Hi,
I have now download the file above and applied it.
Regarding the #marquee & .marquee items i still see some #marquee pages.
I am just trying to get it all the same as if a next needs to be made then not all the pages will alter,
See these examples below but there are 21 in total so should i changed these now to .marquee ?

http://www.theremotedoctor.co.uk/grand_vitara.html?scrollto=content
http://www.theremotedoctor.co.uk/civic.html?scrollto=content

coothead
02-03-2017, 03:15 PM
Hi there theremotedr,


no, they do not have to be changed.

You only have the one "marquee" on those pages,
so there is no duplication of the "id attribute".



coothead

theremotedr
02-06-2017, 02:18 PM
Would you mind taking a look at this please.
http://www.dynamicdrive.com/forums/showthread.php?80916-Contact-form-suggestions

Thanks

theremotedr
02-06-2017, 02:18 PM
Please mark this as resolved as no option for me to do it.

Cheers